0

我试图在全宽页脚中居中一个元素（其中div包含 a h1）并遇到了一些我不理解的行为：直到我将 a width（并删除inline-block）添加到footer-inner容器中，它才居中，即使在换出时也是如此对于h1一个img我得到相同的结果，元素很难离开。

HTML

<div class="footer-outer">
    <div class="footer-inner">
        <h1>Foo Barson</h1>
    </div>
</div>

CSS

.footer-outer {
    width: 100%;
    border: 2px green solid;
    position: fixed;
    left: 0;
    bottom: 0px;
}

.footer-inner {
    border: 2px red solid;
    margin: 0 auto;
    display: inline-block;
    /* width: 144px; */
}

.footer-inner h1 {
    border: 2px black dashed;
    font-size: 130%;
    text-transform: uppercase;
}

这是一个jsfiddle。

我想了解元素何时“无宽度”。如果您能解释或指出我的一些阅读内容，那就太好了。

4

1 回答 1

0

为什么你不能添加text-align:center到.footer-outer. 这将为h1您提供中心

http://jsfiddle.net/feitla/LGEen/3/

于 2013-07-24T23:09:13.123 回答