Success Criterion 2.4.11
Conformance level AA

Keyboard-Triggered Dropdown Covering the Next Focus Stop

2.4.11 — Focus Not Obscured (Minimum)

Scenario

Setting

A photo-sharing app's upload screen

What’s wrong

Keyboard-triggered dropdown covering the next focus stop entirely as user tabs onward.

Example

.sticky-header { position: sticky; top: 0; } /* covers focused fields below it */

Why it matters

Sighted keyboard users when sticky chrome would otherwise hide the focused control.

How to test

Open a keyboard-triggered dropdown and continue tabbing: if the dropdown itself fully covers the next control in the tab sequence, it fails.

How to fix

The focused element must remain at least partially visible — never fully hidden behind sticky bars, banners, or overlays. .input-field { scroll-margin-top: 80px; } /* clears the sticky header on focus */ A focused element must not be entirely hidden behind sticky headers, footers, or other fixed content.

Outcome

On a photo-sharing app's upload screen, this barrier is gone for sighted keyboard users when sticky chrome would otherwise hide the focused control — they can complete the task without hitting this wall.

Who is affected