Detect focus-within state

This demo compares the CSS :focus-within pseudo-class to a JavaScript-based equivalent.

Search website

Enter your search term below:

advanced search

When the container above matches the CSS pseudo-class, you'll see CSS :focus-within ✓ and a blue background. For the JavaScript equivalent you'll see JS focus-within ✓ and a salmon-colored dotted outline.

Read more: Observe a DOM element's focus-within state