如何将<div>对齐到页面的中间(水平/宽度)

我有一个div标签，宽度设置为800像素。当浏览器宽度大于800像素时，它不应该拉伸div，但应该将它带到页面的中间。

当前回答

只需在body标签之后使用center标签，并在body结束之前结束center标签:

<body>
    <center>
        ... Your code here ...
    </center>
</body>

在我尝试过的所有浏览器中，这都是可行的。

其他回答

将这个类添加到你想居中的div(它应该有一个设置的宽度):

.marginAutoLR
{
    margin-right:auto;
    margin-left:auto;
}

或者，添加边缘到你的div类，像这样:

.divClass
{
    width:300px;
    margin-right:auto;
    margin-left:auto;
}

.middle {
   margin:0 auto;
   text-align: center;
}

/*它把div放到中心*/

使用CSS flex属性:http://jsfiddle.net/cytr/j7SEa/6/show/

body {                       /* Centered */
  display: box;
  flex-align: center;
  flex-pack: center;
}

使用下面的代码将div框居中:

.box-content { 保证金:汽车; 上图:0; 右:0; 底部:0; 左:0; 位置:绝对的; 宽度:800 px; 身高:100 px; 背景颜色:绿色; ｝ < div class = " box-content”> < / div >

只需在body标签之后使用center标签，并在body结束之前结束center标签:

<body>
    <center>
        ... Your code here ...
    </center>
</body>

在我尝试过的所有浏览器中，这都是可行的。

推荐文章