何かと問題を起こしやすい z-index について調べる機会があったので まとめました。 要素を意図した通りの重なり順序で表示するには、根本から理解しておいた方が、結果的に早道なのではないかと思います。 この記事は W3C の勧告を元に書きましたが、z-index はブラウザによってバグ等の理由で挙動が違うこともあるようなのでご注意ください。尚、CSS3 の該当モジュールはまだ草案(Working Draft)レベルです。 前提 これはすでにご承知と思いますが、念のため。 要素の重なり順序は、基本的にマークアップした順に奥から手前になります。 親より子供が手前であり、兄弟ならば あとからマークアップした要素が手前に表示されます。 これを踏まえつつ、z-index を指定した場合を考えていきます。 スタック レベルとスタック コンテキスト スタック レベルとは、要素の重なり順序を決める値です