Почему диаметрально противоположные поля не перекрываются с вовлеченной таблицей?

Интересно, почему диаметрально противоположные поля (верхнее поле следует за нижним полем) между двумя блочными элементами (например, div) объединяются, а между блочным элементом и таблицей эти поля складываются.

Пример:

<style>
    .a { margin-bottom: 18px; }
    .b { margin-top: 6px; }
</style>

<div class="a">Foo</div>
<div class="b">Bar</div>

...

<table class="a">...</table>
<div class="b">Bar</div>

Обратите внимание: если я изменю свойство отображения таблицы на «блок», оно будет вести себя так же, как любая другая пара блочных элементов, и их поля будут объединены.

Это почему?


html css html-table margins
person aefxx    schedule 02.02.2010    source источник
comment
В каких браузерах вы наблюдали такое поведение? Я не знаком со спецификацией, поэтому, насколько мне известно, это может быть ошибка рендеринга.   -  person Matchu    schedule 03.02.2010

Ответы (3)


arrow_upward
3
arrow_downward

Это часть блочной модели, называемая сворачивающимися полями, и w3 объясняет это лучше, чем я мог бы.

http://www.w3.org/TR/CSS2/box.html#collapsing-margins

person Gabriele Petrioli    schedule 02.02.2010

arrow_upward
1
arrow_downward

Слияние между элементами уровня блока (Divs и т. д.) и суммирование в элементе уровня блока и встроенном элементе. Подробнее см. здесь.

person Sarfraz    schedule 02.02.2010
comment
Считается ли таблица достаточно близкой к встроенной? - person Matchu; 03.02.2010
comment
Обратите внимание: если я изменю свойство display таблицы на block, она будет вести себя так же, как любая другая пара блочных элементов, и их поля будут объединены. - person Sarfraz; 03.02.2010

arrow_upward
-1
arrow_downward

Это связано с тем, что таблицы не имеют отображаемого значения по умолчанию block, а вместо отображаемого значения table. Если вы установите .a { display: block; }, вы увидите, что поля действительно свернуты вместе (по крайней мере, в Firefox 3.6).

person CalebD    schedule 02.02.2010
comment
Я думаю, что ОП это понимает и задается вопросом, почему это так. - person Matchu; 03.02.2010