有一个选择,我发现:

每个人都说要使用:

margin: auto 0;

但还有另一个选项. 设置此属性为父母 div. 它在任何时候都完美工作:

text-align: center;

看,孩子去中心。

最后,为您提供CSS:

#outer{
     text-align: center;
     display: block; /* Or inline-block - base on your need */
}

#inner
{
     position: relative;
     margin: 0 auto; /* It is good to be */
}

这对我工作:

#inner {
    position: absolute;
    margin: 0 auto;
    left: 0;
    width: 7%;
    right: 0;
}

在此代码中,您将确定元素的宽度。

使用此代码:

<div id="outer">
    <div id="inner">Foo foo</div>
</div>

#inner {
  width: 50%;
  margin: 0 auto;
  text-align: center;
}

它不能集中,如果你不给它一个宽度,否则,它将采取,默认情况下,整个水平空间。

最简单的方式:

#outer { 宽度: 100%; 文本平衡:中心; } #inner { 边缘:自动; 宽度: 200px; } <div id="outer"> <div id="inner">Blabla</div> </div>

如果你知道它的宽度,让我们说它是1200像素,去:

.container {
    width:1200px;
    margin-left: calc(50% - 600px);
}

因此,基本上它将添加50%的左边边,低于已知宽的一半。