0

SafariとChrome（webkit）はどちらも、絶対位置の要素をFirefoxとは異なる方法でレンダリングします。

http://jsfiddle.net/9uswM/5/

<head></head>

<body>
    <div id="container">
        <div id="one"></div>
        <div id="two"></div>
    </div>
</body>


div#container {
    width: 600px;
}
div#one {
    height: 30%;
    width: 20%;
    background: green;
    margin-left: 13.5%;
    margin-top: 4%;
    position: absolute;
}
div#two {
    height: 30%;
    width: 20%;
    background: blue;
    margin-left: 3%;
    margin-top: 10%;
    position: absolute;
}

私見ですが、問題は％-margin-topにあり、これは（定義上）幅に関連しているはずです。これはFirefoxで正しく実行されますが、Webkitベースのブラウザでは実行されません。

何か助けはありますか？

4

1 に答える 1

0

これは Webkit の既知のバグです: https://bugs.webkit.org/show_bug.cgi?id=54613

ビューポートの高さに基づいて、絶対配置要素のパーセント ベースの margin-top が正しく計算されません。

ステータスはRESOLVED FIXEDですので、すぐには問題ないと思います。

于 2013-02-14T16:26:01.397 に答える