我里面有一张桌子.我希望表占据div标签的整个宽度.
在CSS中,我将表的宽度设置为100％.不幸的是,当div有一定的差距时,表格比它的div更宽.
我需要支持IE6和IE7(因为这是一个内部的应用程序),尽管如果可能,我显然喜欢一个完全跨浏览器的解决方案！
我正在使用以下DOCTYPE …
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
编辑：不幸的是,我不能硬编码宽度,因为我动态生成HTML,它包括将divs递归地嵌套在彼此之间(每个div上的左边距,这创建了一个很好的“嵌套”效果).
解决方法
以下内容适用于Firefox和IE7 …指南,但是如果您在元素上设置宽度,则不要在同一个元素上设置边距或填充.这是真的,特别是如果你是混合单位 – 比如混合百分比和像素.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Test</title>
</head>
<body>
<div style="width: 500px; background-color:#F33;">
This is the outer div
<div style="background-color: #FAA; padding: 10px; margin:10px;">
This is the inner div
<table cellpadding="0" cellspacing="0" style="width: 100%">
<tr>
<td style="border: 1px solid blue; background-color:#FEE;">Here is my td</td>
</tr>
</table>
</div>
</div>
</body>
</html>
参见here例子.
