:focus-within
A pseudo-class that targets an element if it or any of its children are focused. It's great for highlighting a whole form group when an input inside is active.
Quick example
.form-group:focus-within {
/* Highlights the entire container when an input inside is focused */
background-color: #eff6ff;
border-color: #3b82f6;
}:focus-within Browser Support
Widely available Since 2020 95% global usage
This feature is well established and works across many devices and browser versions. It has been available across browsers since 2020.
Safe to use without fallbacks.
60+
52+
10.1+
79+