タグ

2022年9月28日のブックマーク (1件)

  • CSSのz-index: 10000;はいらなくなる、要素を最上位に表示する「最上位レイヤー(top layer)」の基礎知識と使い方

    ポップアップやダイアログやフルスクリーンモードを実装する時などによく使用されるCSSのz-index: 10000;が必要なくなります。 Chrome 105のデベロッパーツールで「最上位レイヤー(top layer)」がサポートされました。この最上位レイヤー要素は、z-indexが最も高い要素の上に表示され、かならずドキュメントの最上位に表示されます。 最上位に表示したいコンポーネントをHTMLの最下部や最上部に記述したり、CSSのz-index: 10000;で最上位に昇格させる必要はありません。 Meet the top layer: a solution to z-index:10000 by Jhey Tompkins 下記は各ポイントを意訳したものです。 ※元サイト様のライセンスに基づいて翻訳しています。 CSSの最上位レイヤー(top layer)とは デベロッパーツールで最

    CSSのz-index: 10000;はいらなくなる、要素を最上位に表示する「最上位レイヤー(top layer)」の基礎知識と使い方
    coliss
    coliss 2022/09/28
    最上位レイヤー要素はz-indexが最も高い要素の上に表示され、かならず最上位に表示されます。