CSS :has() change tout

Ce que j'ai appris

Le sélecteur :has() permet de cibler un élément en fonction de ses descendants — autrement dit, c'est enfin le sélecteur parent qu'on attendait depuis 20 ans.

css

/* Card avec image → style différent */
.card:has(img) {
  padding: 0;
}

/* Label quand l'input est checked */
label:has(input:checked) {
  color: green;
  font-weight: bold;
}

Support : Chrome 105+, Firefox 121+, Safari 15.4+. En prod depuis 2023.

Ça remplace des tonnes de JS pour des cas simples de style conditionnel.