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 回答