:has()Baseline · Widely available
The :has() CSS functional pseudo-class matches an element if any of the selectors passed as parameters would match at least one element.
Supported in all major browsers for at least 30 months — safe to use without fallbacks. Baseline since Dec 19, 2023. Widely available since Jun 19, 2026.
Browser support
DesktopChrome
1–104Not supported
105+Supportedsince Sep 2, 2022
Current: 155Edge
12–104Not supported
105+Supportedsince Sep 1, 2022
Current: 154Firefox
1–120Not supported
121+Supportedsince Dec 19, 2023
Current: 157Safari
1–15.3Not supported
15.4+Supportedsince Mar 14, 2022
Current: 27MobileChrome Android
18–104Not supported
105+Supportedsince Sep 2, 2022
Current: 155Firefox Android
4–120Not supported
121+Supportedsince Dec 19, 2023
Current: 157Safari iOS
1–15.3Not supported
15.4+Supportedsince Mar 14, 2022
Current: 27How to use
This feature is Baseline widely available — use it freely, no fallback needed.
Example
CSS
/* Style a card differently when it contains an image */
.card:has(img) {
grid-template-rows: 200px auto;
}
/* Highlight a form field's label when its input is invalid */
label:has(+ input:user-invalid) {
color: crimson;
}Feature detection
CSS · check before using
@supports selector(:has(*)) {
/* styles that use :has(*) */
}
/* or in JavaScript */
if (CSS.supports("selector(:has(*))")) {
// use it
}