@borisblade95

Почему верхние и нижние внешние отступы пустого блока не схлопываются?

Согласно статье "Схлопывание внешних отступов" (https://developer.mozilla.org/ru/docs/Web/CSS/CSS_...), если отсутствуют границы (border), внутренние отступы (padding), строчное содержимое (inline/inline-block), height или min-height для отделения margin-top верхнего отступа этого блока от его margin-bottom нижнего отступа, то верхние и нижние внешние отступы пустого блока схлопываются.
Тогда почему в данном случае не присходит схлопываение внешних границ пустого блока div, у которого margin-top: 300px и margin-bottom: 300px? 66267d78dbd8a224149360.png
  • Вопрос задан
  • 232 просмотра
Решения вопроса 1
Lynn
@Lynn
nginx, js, css
Потому что подсветка в браузере показывает неправильно.

Всё правильно схлопывается.

https://codepen.io/alexeyten/pen/QWPzMZz
Ответ написан
Комментировать
Пригласить эксперта
Ответы на вопрос 3
pickHabr
@pickHabr
fullstack разработчик
Привет) Твой див схлопнут, margin это внешний отступ, а не внутренний (и даже не высота блока), то есть у тебя идет див посередине, а 300 вверх и 300 вниз это уже не див
Ответ написан
@Soer44
Див то пустой. А марджины есть. Это как раздвижение области)))
Ответ написан
delphinpro
@delphinpro Куратор тега CSS
frontend developer
Под схлопыванием подразумевается наложение внешних отступов двух соседних блоков.
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы