我有一个div标签，宽度设置为800像素。当浏览器宽度大于800像素时，它不应该拉伸div，但应该将它带到页面的中间。
当前回答
只需在body标签之后使用center标签，并在body结束之前结束center标签:
<body>
<center>
... Your code here ...
</center>
</body>
在我尝试过的所有浏览器中，这都是可行的。
其他回答
为了让它在ie6中也能正常工作，你必须这样做:
HTML
<body>
<div class="centered">
centered content
</div>
</body>
CSS
body {
margin: 0;
padding: 0;
text-align: center; /* !!! */
}
.centered {
margin: 0 auto;
text-align: left;
width: 800px;
}
简单的http://jsfiddle.net/8pd4qx5r/
html {
display: table;
height: 100%;
width: 100%;
}
body {
display: table-cell;
vertical-align: middle;
}
.content {
margin: 0 auto;
width: 260px;
text-align: center;
background: pink;
}
位置:绝对，然后顶部:50%和左侧:50%将顶部边缘置于屏幕的垂直中心，左侧边缘置于水平中心，然后通过将margin-top添加到div高度的负数，即-100将其向上移动100，同样，margin-left也是如此。这使得div正好位于页面的中心。
# outPopUp { 位置:绝对的; 宽度:300 px; 身高:200 px; z - index: 15; 上图:50%; 左:50%; Margin: -100px 00 -150px; 背景:红色; ｝ < div id = " outPopUp " > < / div >
出于某种原因，之前的答案对我都不起作用。这对我来说很管用，而且在不同的浏览器中也同样适用:
.center {
text-align: center;
height: 100%;
/* Safari, Opera, and Chrome */
display: -webkit-box;
-webkit-box-pack: center;
-webkit-box-align: center;
/* Firefox */
display: -moz-box;
-moz-box-pack: center;
-moz-box-align: center;
/* Internet Explorer 10 */
display: -ms-flexbox;
-ms-flex-pack: center;
-ms-flex-align: center;
}
只需在body标签之后使用center标签，并在body结束之前结束center标签:
<body>
<center>
... Your code here ...
</center>
</body>
在我尝试过的所有浏览器中，这都是可行的。
