如果整个页脚被分成几个文本居中的浮动 div，我该如何居中对齐它？

Question

我有一个由几个列表组成的页脚。我将每个列表放在 div 中，并将它们浮动，以便列表彼此水平相邻。每个列表中的文本居中对齐。现在我想将所有 div 居中对齐！我怎样才能做到这一点？它们被包装在页脚标签中，但由于 div 是浮动的，text-align:center;不会工作。有任何想法吗？谢谢！

我的 CSS 现在看起来像这样：

.footer{
height:180px;}

footer li{
list-style-type:none;
padding:0.2em 1em 0.2em 1em;
text-align:center;}

.section{
float:left;
margin-bottom:2.5em;
padding-top:0.8em;
margin-left:2em;}

Answer 1

.footer {
    margin: 0 auto;
}

这应该将页脚居中对齐

Answer 2

要使元素居中，通常需要 margin: 0 auto 如另一个答案所述。

如果您想要更多元素 within 您的容器居中 within 容器，您不应该浮动它们。浮动它们会使它们脱离布局流。您只想让它们显示：inline-block.

* {
padding: 10px;
text-align: center;
}
footer {
background: #ddd;
}    
.item {
display: inline-block;
background: #999;
width: 20%;
}

示例： http://codepen.io/anon/pen/RKQJNa

如果整个页脚被分成几个文本居中的浮动 div，我该如何居中对齐它？

How can I center align my whole footer if it's divided into several floating divs that have centered text in them?

css

center