具有最大宽度的居中流体 div

Question

我正在尝试将我的内容 div 居中。它设置为 100%，div 包含在 body 中，body 也设置为 100%。我有一个 max-width: 1400px 因为如果屏幕分辨率更高，我不希望我的内容拉伸(stretch)得超过这个值。问题是，使用 margin: auto 是行不通的。我的内容位于左侧，在宽度超过 1400 像素的屏幕上未居中。

如果我删除最大宽度，所有内容都会完美地居中于宽屏幕上，但内容会被拉伸(stretch)到整个屏幕...

#content {
width: 100%;
height: auto;
position: absolute;
top: 400px;
margin: 0 auto;
margin-top: 50px;
display: none;
max-width: 1400px;

Answer 1

实现此目的的最简单方法是将 width 属性设置为您需要的最大宽度，并添加 max-width: 100%;。这将防止它大于 100% 但仍然达到最大宽度。此外，您应该删除 absolute 定位:

JS Fiddle