CSS 백과사전 📚
마진 상쇄 (Margin-collapsing) MDN 블록의 top 및 bottom 마진은 때로 결합되는 마진 중 크기가
가장 큰 마진으로 결합(combine, 상쇄(collapsed)) 됩니다. 어떤 두 개의 블록 요소의 상하 마진이 겹칠 때 한 쪽의 값만 적용되는 현상이다. 마진 상쇄가 일어나는 상황 인접 형제 박스 간 상하 마진이 겹칠 때 겹쳐진 두 마진 중 더 큰 마진 값으로 상쇄해 렌더링한다.
2. 빈 요소의 상하 마진이 겹칠 때 ‘빈 요소’란 높이(height)가 0인 상태의 요소를 말한다. height / min-height / padding / border 등 상하로 늘어나는 값을 명시적으로 주지 않을 경우 내부에 Inline 콘텐츠가 존재하지 않는 요소 부모 박스와 첫 번째 자식 박수의 마진이 겹칠 때 그래서 이럴 경우 부모 박스에 padding을 주어 간격을 유지하는 것이 안전하다. 마진 상쇄 규칙 마진 상쇄는 인접한 두 요소가 온전한 block-level 요소일…