05. CSS 마진 병합 현상과 해결방법 / Box-sizing

6261 단어 CSS멋사TILCSS

마진병합현상 (margin collapsing)

마진 병합 현상이란?

  1. 형제간의 병합현상
    : 요소와 요소의 사이에 margin-top 혹은 margin-bottom의 공간이 있을 경우 더 높은 값의 마진 값이 적용되는 현상
  2. 부모 - 자식간 병합현상
    부모요소와 자식요소간에 margin-top margin-bottom 값이 부모까지 영향

이게 무슨 말이냐 .. ?

먼저
형제간의 병합현상을 먼저 보자면