css-hidden-focus

Focusable elements must not be visually hidden

Checks that keyboard-focusable elements are not visually hidden by CSS techniques that can leave them in the tab order.

Applies to. Applies to elements that are tabbable (keyboard-focusable) but are visually hidden via CSS techniques that can leave them in the tab order.

Expectation. No element should be tabbable while visually hidden (e.g., opacity:0, clipped, off-screen). Notes:

• This rule intentionally targets CSS techniques that *can* keep an element focusable.
• Elements removed from rendering (display:none, visibility:hidden, [hidden]) are excluded.
• The rule uses deterministic heuristics (computed style parsing) and does not rely on layout geometry.

Examples

<a href="/x" style="opacity:0;">Hidden but tabbable link</a>

<a href="/x">Visible link</a>

View source