虽然上面的答案是正确的，但为了让新手更简单，你所需要做的就是设置左距和右距。下面的代码将提供宽度设置和位置是绝对的:

margin: 0 auto;
left: 0;
right: 0;

你也可以使用宽度的其他值，如max-content,fit-content等，如果你不想设置一个单位的值

演示:

.centeredBox { 保证金:0自动; 左:0; 右:0; /**位置为绝对*/ 位置:绝对的; 和框必须有一个宽度，任何宽度*/ 宽度:40%; 背景:# faebd7; ｝ <div class="centeredBox">居中框</div>

你不能使用margin:auto;位置:绝对的;元素，只要删除它，如果你不需要它，但是，如果你需要，你可以使用left:30%;((100%-40%)/2)和媒体查询的最大值和最小值:

.container {
    position: absolute;
    top: 15px;
    left: 30%;
    z-index: 2;
    width:40%;
    height: 60px;
    overflow: hidden;
    background: #fff;
}

@media all and (min-width:960px) {

    .container {
        left: 50%;
        margin-left:-480px;
        width: 960px;
    }

}

@media all and (max-width:600px) {

    .container {
        left: 50%;
        margin-left:-300px;
        width: 600px;
    }

}

Flexbox吗?你可以使用flexbox。

.box { 显示:-ms-flexbox; 显示:-webkit-flex; 显示:flex; -webkit-justify-content:中心; justify-content:中心; ｝ .box div { 边框:1px纯灰色; Flex: 0 1自动; align-self:汽车; 背景:灰色; ｝ < div class = "盒子" > <div class="A">I'm horizontal居中 < / div >

你需要设置左:0和右:0。

这指定了距窗口边缘偏移的距离。

类似于'top'，但指定了框的右边距与框所在块的[左/左]边的[左/右]偏移的距离。

来源: http://www.w3.org/TR/CSS2/visuren.html#position-props

注意:元素的宽度必须小于窗口的宽度，否则它将占用整个窗口的宽度。 您可以使用媒体查询来指定最小裕度，然后对于较大的屏幕尺寸转换为自动。

.container { 左:0; 右:0; margin-left:汽车; margin-right:汽车; 位置:绝对的; 宽度:40%; 轮廓:1px纯黑色; 背景:白色; ｝ < div class = "容器" > 前额凹部。 水蛭。 连续的姿势在前额。 我们的射手，我们的眼睛，我们的眼睛，我们的眼睛。 连续的姿势在前额。 < / div >

这是一个链接，如果位置是绝对的，请使用这个使div在中心。

HTML:

<div class="bar"></div>

CSS:

.bar{
  width:200px;
  border-top:4px solid red;
  position:absolute;
  margin-left:auto;
  margin-right:auto;
  left:0;
  right:0;
}

例子jsfiddle

两者的中心都是垂直和水平的 使用左:50%,最高:50%;转换:翻译(-50%，-50%);

.centeredBox { 保证金:0自动; 左:50%; 上图:50%; /**位置为绝对*/ 位置:绝对的; 和框必须有一个宽度，任何宽度*/ 宽度:40%; 背景:# faebd7; text-align:中心; 填充:10 px; 转换:翻译(-50%，-50%); ｝ <div class="centeredBox">居中框</div>