CSS :focus-within Pseudo-class
Example
Select and style the form when one of the form fields gets focus:
form:focus-within {
border: 2px solid black;
background-color: beige;
color: black;
}
Try it Yourself »
Definition and Usage
The :focus-within pseudo-class
matches an element if the element or any of its descendants gets focus.
| Version: | CSS4 |
|---|
Browser Support
The numbers in the table specifies the first browser version that fully supports the pseudo-class.
| Pseudo-class | |||||
|---|---|---|---|---|---|
| :focus-within | 60 | 79 | 52 | 10.1 | 47 |
CSS Syntax
:focus-within {
css declarations;
}
Related Pages
CSS tutorial: CSS Pseudo classes
CSS reference: :focus
