Firefox 121 が正式リリース、やっと :has() 疑似クラスに対応

Firefox 121 が米国時間の 19 日付けでリリースされ、CSS 関連の更新として :has() 疑似クラスに正式に対応しました。これで主要なブラウザすべてにおいて、:has() 疑似クラスのサポートが足並みそろったことになります。

タイトルでほぼ終わりっていう記事ですが。

Firefox 121 が米国時間の 19 日付けでリリースされ、CSS 関連の更新として :has() 疑似クラスに正式に対応しました。これまで主要なブラウザの中では Firefox でのサポートのみ、待ちの状態になっていましたが、これで問題なく使用できるようになりそうです。

その他、CSS 関連では text-wrap プロパティの balancestable 値、および text-indent プロパティの each-linehanging 値がサポートされています。

また、HTML 関連では iframe 要素に対する loading 属性が有効になりました。loading="lazy" の指定で、遅延読み込みが可能です。

Tailwind CSS も :has() 疑似クラスに対応

Firefox でのサポートが行われ、主要ブラウザでの足並みがそろったことも関係していると思いますが、Tailwind CSS v3.4 がリリースされ、こちらでも :has() 疑似クラスに対応しました。

下記のような記述が可能になっています。

<label class="has-[:checked]:ring-indigo-500">

あと関係ないですが、今回追加された size-* ユーティリティクラス、地味に便利。実は自分で使うときは tailwind.config.jstheme によく使うサイズだけ定義してたりしたんですが、これで不要になります。

関連エントリー

記事をここまで御覧頂きありがとうございます。
この記事が気に入ったらサポートしてみませんか?