Middle
24
0
questionbank

Что такое схлопывание границ в CSS?

Answer from sobes.tech neural network

Схлопывание границ (margin collapsing) — это явление в CSS, когда вертикальные границы блоков, находящихся рядом, сливаются в одну. Размер этой объединенной границы определяется как максимальное значение из схлопывающихся границ.

Схлопывание происходит в следующих случаях:

  • Между соседними элементами: Вертикальные границы двух соседних элементов схлопываются.

    html

    Если <p> имеют margin-bottom и margin-top соответственно, эти границы могут схлопнуться.

  • Между родителем и первым/последним дочерним элементом: Если у родителя нет border, padding, display: flex, display: grid, overflow: hidden и других свойств, которые создают контекст форматирования, его верхняя граница может схлопнуться с margin-top первого дочернего элемента. Аналогично, нижняя граница родителя может схлопнуться с margin-bottom последнего дочернего элемент

Схлопывание границ (margin collapsing) — это явление в CSS, когда вертикальные границы блоков, находящихся рядом, сливаются в одну. Размер этой объединенной границы определяется как максимальное значение из схлопывающихся границ.

Схлопывание происходит в следующих случаях:

  • Между соседними элементами: Вертикальные границы двух соседних элементов схлопываются.

    html

    Если <p> имеют margin-bottom и margin-top соответственно, эти границы могут схлопнуться.

  • Между родителем и первым/последним дочерним элементом: Если у родителя нет border, padding, display: flex, display: grid, overflow: hidden и других свойств, которые создают контекст форматирования, его верхняя граница может схлопнуться с margin-top первого дочернего элемента. Аналогично, нижняя граница родителя может схлопнуться с margin-bottom последнего дочернего элемент

Register or sign in to get access to full answers for all questions from the question bank.

cssmargin-collapsingblock-formatting-contextlayoutvisual-rendering