如何在IE中使其内部内容的大小相同?

时间:2011-03-14 11:29:53

标签: html css html-table

如何制作宽度和宽度? <td>的高度与其内部内容的高度相同?

<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>

在上面的示例中,我希望td的大小与其中的按钮大小相同,但在IE中它需要一些额外的空间。没有JavaScript的解决方案将不胜感激。

2 个答案:

答案 0 :(得分:0)

如果必须使用表格,请尝试为第一列提供100%的宽度。这将强制其他列根据内容缩小到最小尺寸。

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

答案 1 :(得分:0)

我不完全确定为什么这不会适当地调整自己的大小。但是,如果要将宽度轻松修改为静态值,则始终可以在代码中使用CSS样式进行设置。

离。 <td style="width: 600px;">

如果您希望内容自动调整表的大小,则列应格式化为相同的大小。

或者你可以用div来制作它,这也可能更容易使用。沿着这些方向的东西也许是:

<div id="logout">

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

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

</form>

</div>

然后您可以使用外部或内部CSS页面轻松格式化div。

#logout{width: 400px;}

希望有所帮助