...

View Full Version : Table or DIV position in place?



StealthRT
12-17-2007, 07:03 AM
I'm trying to get a table or a DIV to stay where i put it and not to grow once i put some text inside it. But ive not been able to type in it without having it stretch out...

Could anyone show me some CSS code for doing this?

Here is my code:


<table width="81" height="81" border="0" align="center" cellpadding="0" cellspacing="0" style="position: fixed;">
<tr>
<td>&nbsp;</td>
</tr>
</table>


David

VIPStephan
12-17-2007, 07:09 AM
Id really suggest you use a div because a table is only meant for tabular data. Then, as to your question: Is overflow: auto; what you are looking for?

StealthRT
12-17-2007, 07:12 AM
Thanks for the reply VIPStephan

Well let me give more details about what i am doing. I have a table that has a background. The background is a button. I need the table to not go outside the button but i am unable to get a DIV to take the shape of it, only with a table i could. However, i need it not to strech out once i type inside it.

overflow: auto; still streches it out.

Hope that helps you out more,
David

VIPStephan
12-17-2007, 07:27 AM
Why are you using a table as a button? A button is either an image with an anchor around it (<a href=""><img ></a> or a regular text link with a background image (and optionally CSS image replacement) like so: <a href="">link text</a>.

I suppose you chose the table because it collapses automatically to the size of its content? You can style the link to do exactly the same. An anchor is an inline-element by default so it collapses automatically as well. You can apply padding to give the background more room.
Alteratively you can make it display: block; and assign a width or position it absolutely (or I think fixed will do as well except in IE 6) so it collapses to the size of its content. In any case youd need to apply a width for overflow: auto; or hidden to work. A max-width will work as well (except in IE 6 again).

StealthRT
12-17-2007, 07:35 AM
I have attached a pic of what i am talking about.. The display: block; did not work either. It still streches the table.

Its a picture of a blank button in the background so that i can add the text to the front of the button, hints the table im trying to type in. After doing that, i am using a CSS-P to put the overlay over the text so that it looks like its part of the button.

Hope this helps more! :)

David

StealthRT
12-17-2007, 07:56 AM
Current code is:


<table width="81" height="81" border="0" align="center" cellpadding="0" cellspacing="0" style="display: block; max-width:inherit; overflow:hidden;">
<tr>
<td>Derufkmn</td>
</tr>
</table>


David

StealthRT
12-17-2007, 08:24 AM
Ok i got it where i need it for one of the buttons... but it STILL streches when i keep typing! I want it to do like a word-wrap!


style="position: absolute; top: 2695px; left: 707px; width: 80px; height: 82px;"


David

StealthRT
12-17-2007, 08:33 AM
Ok, just got it via this link: http://www.codingforums.com/showthread.php?t=2075

Using the word-wrap:break-word style.


style="position: absolute; top: 2695px; left: 707px; width: 80px; height: 82px; word-wrap:break-word"


David



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum