在页面中间水平和垂直居中div,页眉和页脚粘在页面的顶部和底部

Question

我正在尝试制作一个页面,我有一个固定的高度页眉和页脚.标题位于屏幕顶部(100%宽度),页脚位于底部(100%宽度).我想在页眉和页脚之间的空间中居中具有可变高度内容的div.在下面的jsfiddle中,如果内容比空格短,它就可以工作,但是如果内容太长,它会越过页脚和标题.它在IE中根本不起作用(惊喜,惊喜).

示例:http://jsfiddle.net/VrfAU/4/

编辑:我已经制作了一些图像来尝试使其更清晰.

内容小

内容很大

Answer 1

我最终重新开始尝试不同的方法.工作解决方案可以在下面的新jsfiddle中找到.我们的想法是将页眉和页脚与内容区域分开,以便它们位于顶部和底部.然后,更容易将内容区域集中在那些之间的空间中(对于旧版本的IE,有一些黑客).

http://jsfiddle.net/UYpnC/5/