Процентное позиционирование элементов с разным эффектом в webkit и mozilla

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.

Любая помощь?


html css mozilla absolute webkit
person TomTom    schedule 14.02.2013    source источник

Ответы (1)


arrow_upward
0
arrow_downward

Это известная ошибка в webkit: https://bugs.webkit.org/show_bug.cgi?id=54613

margin-top на основе процента для элемента с абсолютным позиционированием неправильно вычисляется на основе высоты окна просмотра.

Поскольку его статус РЕШЕНО, ИСПРАВЛЕНО, я думаю, что это не будет проблемой в ближайшее время.

person MatTheCat    schedule 14.02.2013
comment
Спасибо за информацию. Для меня это еще хуже: как только они выпустят исправленную версию, мой обходной путь будет работать только для «старых» версий webkit. - person TomTom; 14.02.2013