html - div 不在中间，边距为 0 auto？

Question

我有一个确认框，我想在屏幕中间显示它。

margin 0 auto 没有解决我的问题。

我怎样才能使它居中？

https://jsfiddle.net/y5u5obL0/

#confirmBox{
 position:fixed;
 margin:0 auto;
 width:500px;
 height:150px;
 background:#ffffff;
 border:1px solid #ddd;
}

Answer 1

因为元素是固定的

您需要添加 left: 0;/right: 0 以使元素居中(结合 margin: 0 auto)。这样做时，该元素在技术上会拉伸(stretch)以填满屏幕，但由于它具有指定的宽度，因此它将包含在可用空间内并居中。

Updated Example

#confirmBox {
    position:fixed;
    left: 0;
    right: 0;
    margin:0 auto;
    width:500px;
    height:150px;
    background:#ffffff;
    border:1px solid #ddd;
}