형제간에 발생하는 마진 병합 현상

형제간에 발생하는 마진 병합 현상은 형제 HTML 태그에 margin-bottom과 margin-top 속성을 적용했을 경우 공백이 큰 속성값을 기준으로 설정되는 것을 말합니다.

다음과 같이 #first 안에 margin-bottom: 100px;을 적용하면 노란색 박스를 기준으로 아래쪽에 100px만큼 공백이 생깁니다.

예제 소스 Exercise/7장/3_collapsing_margin/index.html

<div id="first"></div>
<div id="second"></div>