z-index는 매우 간단하게 활용할 수 있는 CSS 속성이다. 어떠한 element에 position과 z-index를 지정해주면 z-index값이 높은 element는 위로, z-index값이 낮은 element는 아래로 내려가게 된다. 매우 간단하면서도 이 정도만 알아도 꽤 많은 프로젝트들을 진행하는 데에는 문제가 없었을 것이다. 그런데 opacity를 적용해서 z-index가 제대로 적용되지 않는 순간부터 문제가 발생한다. opacity는 투명도를 처리하고 z-index는 element의 layer를 다루는데 왜 서로 영향이 있는 것일까? 그에 대해 이해하기 위해서는 Stacking Context, Stacking Order 두 가지 개념에 대한 이해가 필요하다. Stacking Order (쌓임..