개요
블록 서식 문맥(block format context)은 웹 페이지의 블록 레벨 요소를 렌더링하는데 사용되는 CSS의 비주얼 서식 모델(visual formatting model)중 하나이다. 그 안에서 블록박스의 레이아웃이 결정되며 float끼리 서로 영향을 준다.
블록 서식 문맥(block format context)은 다음 중 하나에 의해 생성된다.
- 루트 또는 이를 포함하는 요소
- float (float이 none이 아닌 요소)
- 절대위치로 지정된 요소 (position이 absolute 또는 fixed인 요소)
- 인라인블록 (display: inline-block 인 요소)
- 테이블 셀 (display: table-cell 인 요소, HTML table cell의 기본값)
- 테이블 캡션 (display: table-caption 인 요소, HTML table caption의 기본값)
- overflow가 visible이 아닌 요소
- flex box (display: flex 또는 inline-flex인 요소)
블록 서식 문맥(block formatting context)은 그것을 만든 요소안에 있는 다른 요소들 중, 새로 생성되는 블록 서식 문맥의 하위 요소 내에 있는 요소들을 제외한 모든것을 포함한다.
블록 서식 문맥(block formatting context)은 float의 위치를 정하고 (see float) 해제 (see clear)를 위해 중요한 역할을 한다. float의 위치결정과 해제의 규칙은 동일한 블록 서식 문맥내에 있는 것들에게만 적용된다. float은 다른 블록 서식 문맥의 레이아웃에는 영향을 주지 않고, clear는 동일한 블록 서식 문맥내의 그 이전 float만 해제한다.