0

我在 Firefox 中居中 div 时遇到问题，它似乎在所有 webkit 浏览器中都可以正常工作，所以我真的不知道我在做什么错：

我的 CSS：

html {
width: 100%;
height: 100%;
}

body {
position: absolute;
top: 0px;
bottom: 0px;
left: 0px;
right: 0px;
height: 100%;
width: 100%;
}

#Page {
position: absolute;
left: 0px;
right: 0px;
top: 0px;
bottom: 0px;
}

#LoginBackground {
position: absolute;
margin-top: -45%;
margin-left: -35%;
left: 50%;
top: 50%;
width: 70%;
height: 90%;
}

我的 HTML：

<body>
<div id="Page">
<div id="LoginBackground">
</div>
</div>
</body>

这是 Gecko 引擎中的错误还是我做错了什么。

4

3 回答 3

0

水平对齐对我来说很好，垂直似乎是问题，试试这个，也许。

#loginBackground
{
top:0;
margin-top: 5%;
}
于 2012-04-19T17:58:44.253 回答
0

编辑新小提琴http://jsfiddle.net/FsjNu/2/

html {
width: 100%;
height: 100%;
}

body {
position: absolute;
top: 0px;
bottom: 0px;
left: 0px;
right: 0px;
height: 100%;
width: 100%;
}

#Page {
position: relative;
width: 100%;
    height:100%;
}

#LoginBackground {
border: 1px solid red;
height: 90%;
left: 50%;
margin-left: -35%;
position: absolute;
top: 5%;
width: 70%;

}

<body>
<div id="Page">
<div id="LoginBackground">
</div>
</div>
</body>
于 2012-04-19T18:01:07.033 回答
0

使用 #page{ 宽度：980px; 边距：10px 自动；} #LoginBackground{ 边距：50px 自动；
宽度：500 像素；}

于 2012-04-19T18:04:04.767 回答