12장. Position과 Stacking Context

relative는 원래 자리를 유지한 offset과 absolute descendant의 containing block에, sticky는 scroll container 안의 고정에, fixed는 viewport 계열 위치에 쓴다. sticky가 안 되면 조상 overflow와 scrollport, inset, 사용 가능한 높이를 본다.

z-index 숫자를 백만으로 올려도 다른 stacking context 아래면 이기지 못한다. transform, opacity, isolation, positioned z-index 등이 새 context를 만들 수 있다. DevTools Layers와 DOM 조상에서 경계를 찾는다.

overlay 계층은 token으로 정한다. content, sticky, dropdown, modal, toast의 순서를 문서화한다. native dialog의 top layer는 임의 z-index 경쟁을 줄인다.