CSSでz-indexが効かない時の4つの原因とその対応方法CSSでレイアウトする際、z-indexが期待通りに機能しない時がありませんか？ z-indexは重なり順を定義するプロパティですが、単なる重なり順だけでなく、いくつか複雑なルールがあります。 z-indexがうまく効かない時の主な4つの原因とそれぞれへの対応方法について紹介します。 4 reasons your z-index isn’t working (and how to fix it) 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 はじめに 1. 同じコンテンツ内で積み重なっている要素は出現順に表示され、後の要素は前の要素の上に表示される 2. 要素にpositionが設定されていない 3. opacityやtransformなどのプロパティを設定すると、要素は新しい積み重ねコンテキストに配置される 4. 子要素のz
