12月19日、Firefox121がリリースされた。このバージョンで、CSSの関係（リレーショナル）擬似クラス:has()に対応した。ほかの主要ブラウザ（Chrome、Edge、Safari）ではすでに対応しており、これで:has()が一般的に使えるようになったと言える。

:has()を簡単に説明すると、あるセレクタ（A）に結合子（>、+、~などの明示的な結合子、または暗黙的な子孫結合子）を使って相対するセレクタをhas()内に記述し、その関係性を実際に持つ場合にセレクタ（A）にスタイルを適用できるという擬似クラス。

:has()を使うことで、子の要素に○がある要素、次の要素が△である要素といった、これまでできなかったかたちでスタイルを適用できるようなり、より効率的にCSSを書けるようになる。

:has()の具体的なルールは次のとおり。詳細は仕様を参照のこと。

• :has()内には相対セレクタの羅列（<relative-selector-list>）[1]が記述でき、その記述された相対セレクタのいずれかを持つ場合に適用される。
• ただし、:has()内での:has()は無効[2]。
• また、::beforeなど擬似要素は:has()内の有効なセレクタではない[3]。

たとえば、次のように:has()が記述できる。

See the Pen :has() test by k_taka (@peaceroad) on CodePen.