CSS Selector Level 4 » Relational pseudo-class

The relational pseudo-class represents elements whose relative scope selector matches when evaluated absolute. Currently browser vendors are not required to support this selector in order to conform with the level 4 specification.

# Syntax

selector1:has(selector2) {
    /* declarations */

# Example

header:has(h1) {
    background-color: blue;

The mentioned example applies a blue background color to the header element with <h1> sub elements.

Try example in CodePen

# Browser support

Platform Chrome Firefox Safari Edge Internet Explorer Opera
Desktop No No No No No No
Mobile No No No No No No

# Usage statistics (Alexa Top 1,250,000 sites)

Due to an extreme price increase of our statistics provider the data collection was stopped in September 2018.

Please wait a moment, the comments start loading now...
explorermozillachromesafariopera info external