ie6에서 레이어(layer)와 선택상자(select)가 겹치는 문제

참조 : http://www.hedgerwow.com/360/bugs/css-select-free.html

위 참조 페이지에 있는 얘기를 간략하게 하면 레이어 안에 iframe을 깔면

레이어를 띄워도 iframe이 select 위에 오면서 문제가 해결된다는 것이다.

이를 위해 간단한 css(style)을 사용하게 된다.

위 페이지를 참조해서 내가 만든 내용이다.

위와는 조금 다르다.

〈div>
〈div style="padding:10px;border:1px solid">
내용
〈/div>
〈iframe frameborder=0 style=position:absolute;left:0;top:0;z-index:-1;width:9999px;height:9999px>〈/iframe>

〈/div>

처음 div는 레이어 전체 영역을 정한다.

다음 div는 테두리와 내용 영역을 정한다.

내용을 쓰고 div(내용)를 닫는다.

iframe을 (0,0) 위치에 9999x9999 크기로 지정한다.

또한, 상하 위치를 -1로 하여 바닥보다 아래에 깐다.

물론 레이어에 종속된 것이라 select 보다 위에 위치한 걸로 간주된다.

원본에는 display:none을 줬는데, 이걸 주니까 없는 걸로 취급되어서 다시 select가 위에 뜨더라.

원본에는 그러고도 제대로 작동하는 걸로 봐서 dtd 선언과 관련된 문제일 듯 하다.

위의 내용은 레이어의 안에 들어가는 내용들이다.

레이어 자체에 들어가는 내용은 다음과 같다.

.layer{position:absolute;background:ivory;width:300px;cursor:move;z-index:10;overflow:hidden}