Grokking CSS Design Patterns to Ace Interviews/

...

/

Problem: Accessible Focus Indicator Using :focus-visible

Problem: Accessible Focus Indicator Using :focus-visible

Try to show a custom focus ring on a button only during keyboard navigation.

We'll cover the following...

Problem description

Given an HTML page with a button <button class="keyboard-focus">Accessible Action</button>, write CSS to meet the following requirements:

    ...