如何以特定的宽度和固定的位置将div居中？

Question

我正在编码，并试图将div在页面中间水平居中。 它只是一个普通的div，现在里面没有任何内容。 我的代码是这样的：

#wrapper{
width:500px;
height:100%;
position:fixed;
background-color:#fff;
}

基本上，我只希望宽度为500px的白色矩形在页面中居中放置，该矩形占据页面高度的100％。

谢谢。

Answer 1

您可以分配left:50%然后在margin-left (width-of-div / 2) ，以这种方式将div居中固定/绝对位置

尝试这个：

#wrapper{
   width:500px;
   height:100%;
   position:fixed;
   background-color:#fff;
   left:50%;
   margin-left:-250px;
}

演示

Answer 2

您需要使用剩余的50％，并为宽度的一半加上负数

#wrapper{
width:500px;
height:100%;
left: 50%;
margin-left: -250px;
position:fixed;
background-color:#fff;
}

如果您将此div用作网页的容器，我建议您取出固定位置并使用margin: 0 auto; 将div居中