以高度：100％在内部工作的方式填充剩余高度

Question

考虑这个jsfiddle：http://jsfiddle.net/SD4nM/4/

在Firefox和Chrome中没有滚动条;最里面的div填充剩余的高度，占页眉和页脚。在IE中，最里面的div与身体的高度相同，导致滚动条。

是否存在生成此类布局的跨浏览器方式？

要求：最里面的div不得设置display，标题的高度不得固定。

Answer 1

您可以使用诸如同时定义顶部，左侧，底部和右侧的技术。

jsFiddle Demo

主要CSS：

.wrapper {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: yellow;
}

.content {
    position: absolute;
    bottom: 0;
    left: 0;
    top: 45px;
    right: 0;
    background: red;
}