html – 100%高度,嵌套表,在标准模式下

我正在尝试修复一些表格(嵌套)的显示问题.简而言之,我们展示了一个列出产品的页面.每个产品都显示在自己的表中.并且每个都嵌套在一个更大的表中以布局页面.不幸的是,一些内部表的内容比其他内容略多,它们最终会有不同的大小,导致其他内容不能填充包含单元格.

例如:

<table style="height:500px; background:blue;">
    <tr>
        <td style="vertical-align: top">
            <table style="background:red; height: 100%;">
                <tr>
                    <td>hello</td>
                </tr>
            </table>
        </td>
    </tr>
</table>

在怪癖模式下,红色表格填充蓝色表格,因此您基本上可以看到一个带有蓝色边框的红色表格.

但是,在标准模式下,内部表不会扩展以填充蓝色表.使布局完全没有预期的那样.

我该如何解决这个问题?我不想渲染怪癖,因为这最终会造成维护噩梦.

最佳答案 放风格=“身高:100%;”在< td>上和< tr>标签.将高度设置为100%需要每个父级具有定义的高度.

点赞