8장. 정상 흐름과 Formatting Context

정상 흐름을 이해하면 position을 덜 쓴다. block은 block axis로 쌓이고 inline 내용은 line box를 만든다. margin collapse, containing block, stacking context를 별 개념으로 구분한다.

display:flow-root는 새 block formatting context를 만들어 float를 감싸고 margin 관계를 바꾼다. overflow:hidden을 clearfix로 쓰면 필요한 내용까지 잘릴 수 있다. 문제를 해결한 부수효과가 다른 결함을 만들지 확인한다.

DOM 순서를 시각 배치와 심하게 다르게 만들지 않는다. Grid의 order나 absolute positioning으로 화면만 맞추면 스크린리더·탭 이동이 예상과 어긋날 수 있다.