IE에서 iframe pdf z-index 적용 안되는 이슈

문제점

IE에서 iframe을 사용해 pdf 파일을 보여주는데 드롭다운 메뉴가 pdf 뒤로 가려짐.

=> z-index 적용해도 가려짐

원인

내부 렌더링을 하는 일반적인 DOM 요소는 windowless로 각각의 z-index를 준수하지만 

MSHTML 외부에서 렌더링하는 것은 windowed로 (select 등)은 z-index를 준수하지 않는다.

iframe 태그는 둘다 z-index 준수. 

* iframe은 windowed 요소 였지만 IE5.5에서 windowless 로 변경되었음. 

해결

pdf보다 상위에 출력될 요소 iframe 태그 추가

<iframe src="about:blank" style="position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: -1;"></iframe>

참고

https://stackoverflow.com/questions/12911428/z-index-does-not-work-in-internet-explorer-with-pdf-in-iframe