我正在为HTML页面寻找有效的跨浏览器解决方案：
>消耗100％的屏幕高度,没有溢出(即没有滚动)
>具有垂直(和水平)居中< div>这将掌握主要内容
我知道当包装容器具有静态高度时,可以进行垂直定心.将此高度调整到浏览器窗口高度是否可行？ (最好不要使用JS.)
解决方法
取决于你对“跨浏览器”的意思.以下工作正常,所有当前的,标准兼容的(因此不是IE6)：
HTML：
<div id="a">
<div id="b">
<div id="content"></div>
</div>
</div>
CSS：
html,body,#a {
margin: 0;
padding: 0;
height: 100%;
width: 100%;
}
#a {
display: table;
}
#b {
display: table-cell;
margin: 0;
padding: 0;
text-align: center;
vertical-align: middle;
}
#content {
border: 5px solid red;
width: 100px;
height: 100px;
margin: auto;
}
实例：
