CSSの新しい単位（lvh, svh, dvh)がすべてのブラウザでサポート、100vhがビューポートの高さいっぱいにならない問題を解決

Safari, FirefoxでサポートされていたCSSの新しいビューポート単位「lvh」「svh」「dvh」などが、ついにChromeでもサポートされました！ CSSの新機能で、Chromeが一番最後というのは珍しいですね。 最も活躍するのがiOSのSafariだからでしょうか。とはいえ、主要ブラウザすべてにサポートされるようになるのは、嬉しいニュースです。 画像: @bramus 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 はじめに 新しいビューポート単位「lvh」「svh」「dvh」とは ブラウザのサポート状況 はじめに W3CのCSS Values and Units Module Level 4で、ビューポート単位についていくつか仕様が変更されました。Large、Small、Dynamicといったビューポートサイズ

[coliss]

Safari, FirefoxでサポートされていたCSSの新しいビューポート単位「lvh」「svh」「dvh」などが、ついにChrome 108で実装されます。

[nakaken88888888]

こんなにいっぱい単位ができてしまって、ほんとに朗報なんだろうか。。。

[bascinet]

新しいバージョンで対応したからといって直ぐ実務で使えるわけじゃないのがつらいところ。使えるようになる頃には忘れてるんだよな

[ejointjp]

これを朗報と言うのだろうか。

[at_yasu]

（白目）

[spark7]

前に見た気が。Chrome対応になったってことね。 https://coliss.com/articles/build-websites/operation/css/large-small-dynamic-viewports.html

[seal2501]

朗報ではないです

[nakachop]

まぁ！

[nekosann_08]

ああああああ（頭をもたげる

[advancive61]

これはiOSが悪い

[zettaimuri]

めんどくさい

[hate_nao]

確かにw 普段CSS触ってる人にとっては朗報なのかな > こんなにいっぱい単位ができてしまって、ほんとに朗報なんだろうか。。。

[aceraceae]

正しく使えばこれでいろいろ吸収できるようになってすっきり書けるようになるかな？

[d6rkaiz]

また増えたのか

[lli]

もう使ってる

[tourmalinecatseye]

覚えられないよぅ……！CSSは選択肢が多すぎる・・・

[Lewisik]

記念パピコ

[m4fg]

また新しい単位作ってるー

[mayumayu_nimolove]

スマホのブラウザでvh使えばそうなるとかできないのかな。書き分けが昭和でわけわかめー。