html - 如何在绝对定位的 div 中居中 div？

Question

我正在使用流畅的布局设计，我希望类 center 的 div 在类 outer 的 div 内部水平居中。我试过这个，但它不起作用。我做错了什么？

HTML:

<div class="outer">
    <div class="inner"> // this div has height=0. Why?
        <div class="center">
            // stuff
        </div>
    </div>
</div>

CSS:

.outer {
    position: absolute;
    left: 0;
    right: 0;
    top: 50px;
    height: auto;
}

.inner {
    width:100%;
}

.center {
    margin:0 auto;
}

Answer 1

使用百分比作为 margin-left，例如:

.center
{
width:90%;
margin-left:5%;
}

我使用 5% 的原因是因为中心的宽度是它容器的 90%，我们还有 10% 的空间剩余，所以要使它居中，你必须将它移到左边一半的位置可用空间;在这种情况下是 5%