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{ width:980px; を使用します。マージン:10px 自動; } #LoginBackground{ margin:50px auto;
幅:500px; }

于 2012-04-19T18:04:04.767 に答える