html竖中心,html – Div水平中心和垂直中间

参见英文答案 >

Best way to center a

on a page vertically and horizontally?21个

我想对齐一个div的水平中心和垂直中间的一个页面的正文.

css：

.loginBody {

width: 100%;

height: 100%;

margin: 0;

padding: 0;

background: #999; /* for non-css3 browsers */

filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#cccccc',endColorstr='#000000'); /* for IE */

background: -webkit-gradient(linear,left top,left bottom,from(#ccc),to(#000)); /* for webkit browsers */

background: -moz-linear-gradient(top,#ccc,#000); /* for firefox 3.6+ */

}

.loginDiv {

position: absolute;

left: 35%;

top: 35%;

text-align: center;

background-image: url('Images/loginBox.png');

width:546px;

height:265px;

}

我有这个html：

现在它的行为就像我想要的那样,但如果我调整浏览器的大小,它就会完全扭曲,也许这是因为绝对的定位.我正在展示一些截图：

在调整大小的Firefox中：

在调整大小的chrome中：

调整大小ie：

在最大化的窗口是：

有没有办法解决这个问题,使用相对定位来实现这个对中的对齐？

谢谢.

编辑：

在Firefox中,调整大小时不会出现滚动条,但会出现在其他浏览器中.