html - 宽度自动不会居中

Question

为什么定义了自动宽度的元素在我尝试为它自动分配边距(左右)时没有居中？除了 margins 之外，还有其他技巧可以使具有自动宽度的元素居中吗？

代码如下:

<div style="width:auto; margin:0 auto 50px;">
 <a href="#">Dummy link</a>
</div>

Answer 1

添加display: inline-block到，并删除width:auto来自，您当前的 <div> .然后，创建一个外部 <div> , 如果您还没有，请添加 text-align: center

<div style="text-align:center;">
  <div style="display:inline-block; margin:0 auto 50px;">
    <a href="#">Dummy link</a>
  </div>
</div>

JSFiddle: https://jsfiddle.net/uLp7qj3e/