问题

如何在< div> 中使用 CSS (如果可能的话)水平居中< div>

外部< div> width:100%:

<div id="outer" style="width:100%">  
  <div id="inner">Foo foo</div>
</div>



解决方法

您可以将此CSS应用于内部&lt; div&gt; :

#inner {
    width: 50%;
    margin: 0 auto; 
}

当然,您不必将 width 设置为 50%.任何小于包含&lt; div&gt; 的宽度都可以使用. margin:0 auto 是实际居中的.

如果您定位的是IE8 +,最好改为:

#inner {
    display: table;
    margin: 0 auto;
}

它将使内部元素居中水平,并且工作时不设置特定的 width .

这里的工作示例:

#inner {
    display: table;
    margin: 0 auto; 
}
<div id="outer" style="width:100%">  
  <div id="inner">Foo foo</div>
</div>




相关问题推荐