Focusable Divs :focus-within test

This page contains various focusable divs and demonstrates a proposal for only drawing a focus ring when the keyboard is being used. Navigate through the interactive elements in various ways (using mouse, switch to keyboard, try it on a touch device). You should see a focus indicator on the element's parents whether you interact with them via keyboard or mouse.

Focusable <div>s :focus-within

tabindex="0"
tabindex="-1"
tabindex="0" with explicit class="focus-visible"