Question

嗨我有一个女巫的容器会添加多重元素所以我真的不知道容器的宽度是什么，因为元素是动态添加的。我需要这个容器居中所以我想我应该使用display：inline-block来设置div的宽度和高度根据它的元素设置但是在我使用之后属性margin：0 auto不再工作了。这是我想要实现的一个简单的例子：

<div> 
      <ul>
           <li>All</li>
           <li>Web Design</li>
      </ul>
</div>


div{
      display:inline-block;
      margin:0 auto;
}

无论该容器中有多少元素，我都希望它居中。我的治疗方法不起作用，所以如何将这个容器放在中心？

Answer 1

将text-align: center添加到CSS。

Answer 2

你可以通过添加一个包含显示块并设置text-align:center的包装div来实现：

<div id="wrapper">
    <div> 
      <ul>
           <li>All</li>
           <li>Web Design</li>
      </ul>
</div>
</div>

div#wrapper{
    text-align:center; 
    display:block;    
}
div{
      display:inline-block;
      margin:0 auto;
}

请参阅this小提琴。

Answer 3

div{
      display:inline-block;
      margin:0 auto;
      text-align: center
}

使具有显示的容器居中：内联块设置

3 个答案: