【CSS】z-indexプロパティが効かない時の対処法【未解決】

村上 著者:村上

【CSS】z-indexプロパティが効かない時の対処法【未解決】

タイトルにも明記しましたが、こちらは未解決です。
有効な対処法を発見したら、改めてまとめます…。

 

今回は、要素の重なり順を指定するための z-index プロパティについてです。
Webページのある要素を、最前面に配置しようとしたところ…何故か z-index が有効にならず、他の要素のしたに潜り込んでしまいます。
で、その対処法について検索したところ、一番上に表示されたのがこちらのページです。

z-indexの使い方:CSSで重なり順を指定する
https://saruwakakun.com/html-css/basic/z-index

こちらによると、z-index は position プロパティに static 以外が定義されている必要があるとのこと。
position プロパティのデフォルト値は static なので、relative や absolute など、なにかしらの値を定義する必要があります。
現在の要素の位置を変更したくない場合は、relative を指定しましょう。

が、z-index を指定した要素には、もともと position: absolute; が定義されており…こちらは関係なかったようです。
他の要素の CSS が関係しているようなので、もう少し調べてみたいと思います。

 

以上、CSS の z-index が効かなかった時の対処法でした。
私の環境では解決しませんでしたが…とりあえず、position プロパティを指定しているかを確認しましょう。

  • この記事いいね! (0)

著者について

村上

村上 administrator