css - 父元素大于屏幕的 CSS 中心元素

Question

这是我的html：

<div id="bar">
    <div class="container">
        <div class="item"></div>
    </div>
</div>

#bar 是 100% 并且溢出隐藏。

.container 为 1600 像素，边距：0 自动；将其居中。还有位置：相对；

.item 是 960px，我想把这个元素居中

当我的屏幕正好是 1600 像素时， .item 正确居中。但是当我把它变小时， .item 会向右移动更多。看起来计算出的边距总是 320px ((1600-960)/2) 并且是从 .container 相对计算的。但是浏览器会应用相对于视口的边距。

有谁知道当父级不可见时如何让浏览器应用相对于其父级的边距？

score 0 · Accepted Answer

我在 jsfiddle 上提出了一个这样的例子，但使用了更小的尺寸，所以它是可见的。添加margin: 0 auto;到 .item 应该可以解决它。

1 回答 1