In CSS we can only style down parent to child, but we can't select parent from child. Using the :has() selector can select elements based on the presence of child. This can be used as a "parent" selector and allows much more complex dependencies. This will be usefull when developing complex designs.

Syntax

class:has(.child-class) {
  background-color: blue;
}

And also can use multiple conditions as below

class:has(.child-class):has(div) h2 {
  color: red;
}

Updated:

Leave a Comment