CSS Понимание полей относительно границ - PullRequest
Новая
       7

CSS Понимание полей относительно границ

2 голосов
/ 20 ноября 2011

Я пытаюсь понять поведение, которое я видел, когда возился с каким-то html-кодом, который вы можете увидеть здесь .

Вы заметите, что если вы измените следующее: 

<div style="border: solid 1px black;">
    <div style="margin-top:50px;">
        Post Title
    </div>
</div>

на это (т. Е. "Border: solid 1px black;" to "border: solid 0px black;"):

<div style="border: solid 0px black;">
    <div style="margin-top:50px;">
        Post Title
    </div>
</div>

поле внутреннего элемента div больше не влияет на внешний элемент div.Я пытался найти спецификацию W3.org, которая определяет это поведение, но не повезло.Кто-нибудь хочет помочь?

1 Ответ

5 голосов
/ 20 ноября 2011

Это называется "коллапсирующими полями".

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

Некоторые легче читать:

...