How can I make the <td> size the same as its internal content in IE?

How can I make the width and height <td>the same as its inner contents?

<table cellspacing=0 cellpadding=0>
<TBODY>
<TR>
<TD></TD>
<TD id=loginButton><BUTTON class=btn><SPAN>Login</SPAN></BUTTON></TD>
<TD id=changePasswordButton><BUTTON class=btn><SPAN>Change Password</SPAN></BUTTON></TD>
<TD id=forgotPasswordButton><BUTTON class=btn><SPAN>Forgot Password</SPAN></BUTTON></TD></TR>
</TBODY>
</table>

In the above example, I would like the td size to be the same as the size of the buttons inside it, but in IE it takes up some extra space. Solutions without JavaScript will be appreciated.

+3
source share
2 answers

If you must use a table, try specifying the first column 100% wide. This will cause other columns to shrink to a minimum size based on the content.

http://jsfiddle.net/Jaybles/wq3Yz/

0
source

, . , , CSS .

. <td style="width: 600px;">

, , .

divs, . - :

<div id="logout">

<form method='post' action='logOut.php'>

<input type='submit' value='Logout' name='logout' />

</form>

</div>

CSS, div.

#logout{width: 400px;}

,

0

All Articles