[CSS] z-index 가 작동하지 않을 때

가끔 z-index가 왜 작동하지 않는 것 처럼 보이는 문제가 있다.

 

이런 경우 대부분의 경우 해결책은 다음과 같다.

1. position 속성을 확인해보자(static이 아니어야 한다)
2. 부모 요소의 z-index가 다른 요소의 z-index보다 낮다면, 자식 요소가 아무리 z-index가 높아도 다른 요소에 의해서 가려진다. 부모 요소의 z-index를 확인해보자.

지금까지 대부분 1번, 가끔씩 2번 경우를 해결하면 정상적으로 작동하였다.