我正在使用css表,其中最后一个表行的高度为100% – 以填充剩余的高度.
这适用于我跨浏览器(包括IE).
但是,如果我然后在最后一个表格行添加一些固定高度的div(这是动态内容 – 我不知道它们中有多少)最后一个div有高度:100% – 为了填满最后一个表格行. – 像这样:
这现在在IE中不起作用(即使是IE10)
我该怎么做才能在IE中工作?
(编辑:正如在评论中正确指出:它在任何浏览器中都不起作用 – 虽然在Chrome和Firefox中它看起来像是有效的 – 高度:第三行最后一个div的100%没有填满剩余高度,但占据第3行的完整高度……
所以我尝试在第3行使用表行: – FIDDLE …现在这适用于其他浏览器,但仍然无法在IE中运行!)
标记
CSS
.table
{
display: table;
width: 600px;
height: 300px;
}
.row
{
display: table-row;
}
.row1
{
height: 50px;
background: pink;
}
.row2
{
height: 100px;
background: orange;
}
.row3
{
height: 100%;
background: yellow;
}
.row3a
{
height: 30px;
background: purple;
}
.row3b
{
height: 60px;
background: aqua;
}
.row3c
{
height: 100%;
background: brown;
}