Margin Collapsing

margin collapsing이 일어나는 경우

1. 형제사이

인접한 형제사이 블록 사이 위 아래의 마진이 겹치는 경우, 더 큰 크기의 마진으로 상쇄되게 된다.

2. 부모자식

부모 요소와 첫번째 자식의 위쪽 마진값 또는 또는 마지막 자식의 아래쪽 마진값이 겹칠 때 상쇄되게 된다

3. 비어있는 요소의 위/아래 마진이 겹칠 때

레이아웃 구성을 위해 div로 영역을 만들어 놓거나, 내부에 요소에 빈 컨테이너를 만들어놓을 경우 등, 비어있는 요소를 만드는 경우가 발생한다.
빈 요소들과 인접한 요소들이 겹쳐지는 경우 마진 상쇄가 발생한다.