CSS で絶対に最前面に表示したい要素には z-index:calc(infinity) を指定する

いつの時代にも z-index の管理には頭を悩ませます。z-index の値には 1 以外の値を許可しないなどの管理方法がありますが、外部のライブラリを使用してる場合に勝つことができません。 そこで z-index の値に calc(infinity) を指定すると、絶対に最前面に表示させることができます。 infinity は calc() の中で使用できる特殊な値です。名前の通り最も大きな値を表します。 そのため、どんなに大きな z-index の値を指定されても、calc(infinity) が最も大きな値になるため、最前面に表示されるわけですね。

[sangping]

無限の攻撃力を持つ鉾と、無限の防御力を持つ盾をぶつけたら、どっちが勝つの？……と。

[Falky]

9999よりも強い値が指定できたかｗ いまはこんな仕様があるんだなあ https://developer.mozilla.org/en-US/docs/Web/CSS/calc-constant //text-indent: -9999px をいっぱい書く時代にこれがあれば、calc(-infinity)が流行ったに違いない

[kijtra]

Chrome の top layer 機能に勝てなくて無駄に悩む人でそう

[securecat]

z-index:2147483647には勝てない（同値）

[rogertroutman]

いいえ、z-index の値がいくつであっても top layer には勝てません。 絶対に最前面に表示されなければならない特別な要素には top layer を使いましょう https://developer.mozilla.org/en-US/docs/Glossary/Top_layer

[puhu208n]

じゃあ、そのz-indexで定数を割ったらどうなんの

[boxshiitake]

つよい

[cartman0]

どうせそれが複数になって意味をなさないやつ

[srng]

“勝つことができません” 仁義なき戦いだ

[Shinwiki]

いや、そこじゃなくて適用レイヤーの把握だろ。数字大きい方が勝つためならいっぺんライブラリの数字見てみりゃ済むことでさ。

[mayumayu_nimolove]

その逆はcalc(singari)

[mr_mayama]

VRで見たら目ん玉にDOMが刺さるな

[knjname]

この上はℵで比較されるのか？

[efcl]

`calc(infinity)`

[Windymelt]

z-indexにinfinity指定できるのか・・・