Question

我想创建一个带有水平居中内容块的页面，该页面从浏览器窗口的顶部到底部。我已经发现表格不是设计布局的正确方法。从上到下的块不是问题：

<div style="position:absolute;top:0px;width:800px;height:100%;background-color: #fff;">
</div>

但是我无法让这个Div居中。我试过了

“余量：自动”

但没有效果。 Th将文本置于Div的中心，而不是屏幕上的Div本身。

Answer 1

要使div居中，您需要两个东西，宽度和自动水平边距。像这样：

#myDiv {
    width:800px; /* or whatever */
    margin:0 auto;
}

不需要绝对定位，只需要这两个规则就可以了。

Answer 2

以绝对定位的div为中心添加left: 50%; margin-left: -400px;

其中负边距值是div的宽度的一半

Answer 3

除非必要，否则尽量不要将position:absolute用于布局。 This sample显示了将内容水平居中的最佳做法。

如果您需要一个能够持续抑制可视区域内容区域高度的解决方案，请尝试我的jQuery解决方案：http://jsfiddle.net/BumbleB2na/Z75hA/