CSS Box-модель, кажется, сломана в Chrome 15 (последняя стабильная версия) - PullRequest
Новая
       1

CSS Box-модель, кажется, сломана в Chrome 15 (последняя стабильная версия)

3 голосов
/ 06 декабря 2011

Я думал, что дни проверки проблем коробочной модели между современными браузерами давно прошли ...

У меня были проблемы с тем, чтобы Chrom [e | ium] правильно отображал мой веб-сайт, и мне удалось создать действительно простой пример того, что идет не так:

HTML: 

<div class="block">
    <div class="left">LEFT!</div>
    <div class="right">
        RIGHT! 16px margins on everything.... What's that??? → → → 
    </div>
</div>

CSS: 

div.left {
    float: left;
    margin: 16px;
    padding: 16px;
    width: 256px;
    height: 256px;
    outline: 1px solid red;
    background: #fee;
}

div.right {
    margin: 16px;
    padding: 16px;
    overflow: hidden;
    outline: 1px solid blue;
        background: #eef;
}

Скриншот проблемы:

enter image description here

Живая демоверсия:

http://jsfiddle.net/g105b/BJuYR/

1 Ответ

1 голос
/ 06 декабря 2011

Ни один другой браузер не ведет себя так, как WebKit, здесь.

Поиск в WebKit Bugzilla для "поля контекста блочного форматирования" дает очень похожий результат:

https://bugs.webkit.org/show_bug.cgi?id=19123

В качестве обходного пути вы можете использовать исправление, предложенное мной в комментарии:

удаление левого поля в div.right сортирует его: http://jsfiddle.net/BJuYR/13/

...