Выбор ответа Middle Блочная модель обновлено
Margin ребёнка вытекает из родителя
Вопрос
У .child margin-top: 40px, и отступ появляется не внутри .parent, а над ним, сдвигая родителя вниз. Какое свойство у .parent исправит это и не создаст побочных эффектов с обрезкой?
<div class="parent">
<div class="child">Текст</div>
</div>
Попробуйте сами
Выберите вариант, и откроется разбор.
Показать ответ и разбор
Коротко
Правильный ответ: display: flow-root. Margin первого ребёнка схлопывается с margin родителя, если между ними нет padding, border или нового блочного контекста форматирования. display: flow-root создаёт новый BFC без побочек вроде обрезки содержимого у overflow: hidden.…
Варианты ответа
position: relativemargin-top: 0display: flow-rootправильный ответz-index: 1
Разбор
Margin первого ребёнка схлопывается с margin родителя, если между ними нет padding, border или нового блочного контекста форматирования. display: flow-root создаёт новый BFC без побочек вроде обрезки содержимого у overflow: hidden. position: relative и z-index BFC не создают, обнуление margin родителя ничего не меняет, потому что вытекает margin ребёнка.
Ответьте сами, а не прочитайте
В тренажёре вопрос попадёт в повторения и вернётся, когда начнёт забываться. Плюс билеты с зачётом: 20 вопросов, не больше 2 ошибок.