使DIV填满整个表格单元格
我已经看到了这个问题并进行了一些搜索，但目前为止没有任何工作。 我认为现在是2010年（这些问题/答案是旧的，而且没有答案），我们有CSS3！ 有没有办法让一个div使用CSS填充整个表格单元的宽度和高度？
我不知道单元格的宽度和/或高度会提前多久，并且将div的宽度和高度设置为100％不起作用。
此外，我需要的div的原因是因为我需要绝对定位一些元素的单元格外， position: relative不适用于td s，所以我需要一个包装div。
以下代码适用于IE 8，IE 8的IE 7兼容模式和Chrome（未在别处测试过）：
<table style="width:100px"> <!-- Not actually necessary; just makes the example text shorter -->
<tr><td>test</td><td>test</td></tr>
<tr>
<td style="padding:0;">
<div style="height:100%; width:100%; background-color:#abc; position:relative;">
<img style="left:90px; position:absolute;" src="../Content/Images/attachment.png"/>
test of really long content that causes the height of the cell to increase dynamically
</div>
</td>
<td>test</td>
</tr>
</table>
你在原来的问题中说过，将width和height设置为100%并不起作用，但这让我怀疑还有其他一些规则会覆盖它。 您是否在Chrome或Firebug中检查计算的样式以查看宽度/高度规则是否真的被应用？
编辑
我是多么愚蠢！ 该div是根据文本大小，而不是td 。 您可以通过使div display:inline-block来解决此问题，但它不适用于IE。 这证明技巧...
表格单元格中的div height = 100％仅当表格具有高度属性本身时才起作用。
<table border="1" style="height:300px; width: 100px;">
<tr><td>cell1</td><td>cell2</td></tr>
<tr>
<td>
<div style="height: 100%; width: 100%; background-color:pink;"></div>
</td>
<td>long text long text long text long text long text long text</td>
</tr>
</table>
UPD在FireFox中，你也应该设置height=100%值到父TD元素
如果你希望在表格单元格中使用100％div的理由是为了能够将背景颜色扩展到整个高度，但仍然能够在单元格之间有空格，那么可以给<td>本身赋予背景颜色和使用CSS border-spacing属性在单元格之间创建边距。
但是，如果您确实需要100％的高度div，则正如其他人在此提到的那样，您需要为<table>指定一个固定高度或使用Javascript。