css - 在可变高度中制作 div td height:100% 可以跨浏览器工作

Question

在有人开始尖叫“不要使用表格进行布局”之前，我无法创建适合我情况的非表格布局。

由于显而易见的原因，直接设置height: 100%不起作用（也许不是那么明显，但我理解它为什么不起作用）：

<td>
    <div style='height:100%'></div>
</td>

---

尝试使用绝对定位：

<td style='position:relative'>
    <div style='position:absolute; top:0px; bottom:0px;'></div>
</td>

FF 中断，因为它无法识别 td 上的定位。还神秘地在 IE9 中中断。

Answer 1

为了使百分比值适用于身高，必须确定父母的身高！

这意味着td元素需要height定义：

<table>
    <tr>
        <td style='height:100px'>
           <div style='height:100%'>hi</div>
       </td>
    </tr>
</table>