如何让div居中

Question

我想将外部 div 对齐设置为居中。有一些内部 div 的浮动设置为左侧。所以外层div没有居中对齐 我的内部 div css 是：

.inner { 
  float:left; 
  margin:10px; 
  border:1px solid #898989; 
  padding:4px;  
  width:200px; 
  background-color:#f2f2f2;
}

Answer 1

为什么内部 div 是浮动的，如果不需要，只需将内部 div 居中即可？

.inner { 
  margin:10px auto; 
  border:1px solid #898989; 
  padding:4px;  
  width:200px; 
  background-color:#f2f2f2;
}

或者，如果内部是浮动的，因此它包含更多浮动..那么您可以向其添加隐藏的溢出

.inner { 
  overflow: hidden;
  margin:10px auto; 
  border:1px solid #898989; 
  padding:4px;  
  width:200px; 
  background-color:#f2f2f2;
}

，或者您可以将内部制作为内联块 - 并将其包装在带有 text-align: center; 的 div 中；

<div class="outer">
<div class="inner"><span>float</span>the inner text</div>
<div class="inner"><span>float</span>the inner text</div>
<div class="inner"><span>float</span>the inner text</div>
<div>

.inner { 
  display: inline-block;
  margin:10px; 
  border:1px solid #898989; 
  padding:4px;  
  width:200px; 
  background-color:#f2f2f2;
}

.inner {display: inline !ie7;}

span {float: left; width: 50px; height: 50px; background: #ffe;}

.outer {text-align: center;}

Answer 2

如果您的问题没有更多细节，我只能建议

<div style='margin: 0px auto;'>Blah</div>

但这确实取决于您还发生了什么。

Answer 3

最简单的方法是将水平边距设置为自动：

<div style="margin-left: auto; margin-right: auto;">Content</div>

但这也取决于其浮动属性。由于我不知道您的网站上还有什么，我只能建议您尝试不同的浮动属性（左、右、无）。

祝你好运！ :)

Answer 4

尝试：

<div align="center" style="clear:left"> 
...
</div>

Answer 5

这是最简单的方法：

如果您设置固定宽度，
当然还有正确的 DOCTYPE，试试这个

    Margin-left:auto;
    Margin-right:auto;

希望有帮助。