출처 :http://therealcrisp.xs4all.nl/meuk/IE-zindexbug.html

소스코드를 보면 노란 박스가 z-index 가 20인데도 z-index 가 10인 초록색 박스 밑으로 깔려버린다.
두 박스의 차이점은 노란박스를 싸고있는 다른 div 가 하나 더 있다는 차이점 뿐이고, 노란박스를 싸고 있는 div 는
position:relative 로 되어있다는 것이다.
IE 에서만 이런경우 z-index 를 무시해 버린다.

이유는 잘 모르지만 노란박스가  20 의 z-index 값을 갖고있지만 노란박스를 싸고 있는 div 는 z-index 가 지정되지 않아 0 이고, 그의 자식인 노란박스가 그것을 따르는 것 같다.

시험삼아 노란박스를 싸고 있는 div(#container) 에 z-index  20 을 주니 정상적으로 동작했다.

IE 에서는 포지션이 지정된 엘리먼트의 자식노드들은 부모 노드의 z-index 를 따르는 것인가?
신고

댓글을 달아 주세요

  1. 2008.10.21 14:24 Address Modify/Delete Reply

    비밀댓글입니다

티스토리 툴바