いつの時代にも z-index の管理には頭を悩ませます。z-index の値には 1 以外の値を許可しないなどの管理方法がありますが、外部のライブラリを使用してる場合に勝つことができません。
そこで z-index の値に calc(infinity)
を指定すると、絶対に最前面に表示させることができます。
infinity
は calc()
の中で使用できる特殊な値です。名前の通り最も大きな値を表します。
そのため、どんなに大きな z-index の値を指定されても、calc(infinity)
が最も大きな値になるため、最前面に表示されるわけですね。
ただし z-index のスタッキングコンテキストの仕組みには当然従うため、calc(infinity)
を指定したとしても、必ずしも最前面に表示されるとは限りません。