html设置表格高度100%,html – IE – 在表格行中使用100％高度

我正在使用css表,其中最后一个表行的高度为100％ – 以填充剩余的高度.

这适用于我跨浏览器(包括IE).

但是,如果我然后在最后一个表格行添加一些固定高度的div(这是动态内容 – 我不知道它们中有多少)最后一个div有高度：100％ – 为了填满最后一个表格行. – 像这样：

这现在在IE中不起作用(即使是IE10)

我该怎么做才能在IE中工作？

(编辑：正如在评论中正确指出：它在任何浏览器中都不起作用 – 虽然在Chrome和Firefox中它看起来像是有效的 – 高度：第三行最后一个div的100％没有填满剩余高度,但占据第3行的完整高度……

所以我尝试在第3行使用表行： – FIDDLE …现在这适用于其他浏览器,但仍然无法在IE中运行！)

标记

row1

row2

row3a

row3b

row3c

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;

}