IEでのモーダルウィンドウ

IE6でモーダルウィンドウを使う場合、
Z-INDEXをいくら指定してもテキストエリアやプルダウンなどが
それを突き破って表示してしまう。
IE6はINPUTのパーツをWindowsコンポーネント利用しているからみたいで、
これはけっこう有名な話。

jquery.bgiframe.jsなどのプラグインを使って、
モーダルエリアに対してiframeをかぶせることによって解決できるんだけど、
これを適用しても解決しない事象が発生。

色々調査したらStyleを「position: relative;」にしているブロックがあると
これが最前面に出てきてしまうみたい。
このスタイルを消したら直った。IE6とIE8で確認。

Internet Explorerなど消滅してしまえ。




以下では×ボタンとGmailっぽい詳細検索アイコンを表示させる為に
relativeにしてたのでテキストエリアがはみ出してる。


実践Webデザイン jQuery+CSSフレームワークでサクサクつくる「動き」と「仕掛け」