Skip to main content
Tu navegador es demasiado antiguo para mostrar este sitio correctamente. Actualiza a la última versión de Chrome, Edge, Firefox o Safari.
Back to WCAG Database
Level AAWCAG 2.2

2.4.11 Focus Not Obscured (Minimum)

When a user interface component receives keyboard focus, the component is not entirely hidden due to author-created content.

Last reviewed: September 9, 2026

Understanding 2.4.11

This criterion was added in WCAG 2.2 to address a common modern pattern: sticky headers, sticky footers, cookie consent banners, and chat widgets that can visually cover an element just as it receives keyboard focus, leaving a keyboard user with no idea what is currently focused. It ensures that at least some part of the focused component remains visible so the user can find their place, benefiting keyboard users generally and screen magnifier users especially.

How to Meet It

Audit any fixed or sticky-positioned elements (sticky headers/footers, cookie banners, live chat launchers) to confirm they never fully cover a focused element as the user tabs through the page. A common fix is applying `scroll-margin-top` (or `scroll-margin-bottom`) to focusable elements so the browser leaves room for the sticky element when scrolling a newly focused item into view.

Code Examples

INCORRECT
header {
  position: sticky;
  top: 0;
  height: 120px;
  z-index: 10;
}
/* No scroll offset defined - focused inputs beneath scroll fully underneath the sticky header */
CORRECT
header {
  position: sticky;
  top: 0;
  height: 120px;
  z-index: 10;
}
input, a, button {
  scroll-margin-top: 130px; /* keeps focused elements clear of the sticky header */
}

Frequently Asked Questions

Does a tooltip or dropdown that intentionally opens on top of other content violate this criterion?

Generally no, as long as it doesn't cover the component that currently has focus itself. This criterion is about the focused component being hidden, not about other author-created overlays existing elsewhere on the page. A dropdown covering unrelated content below it is unaffected; a dropdown covering the very input that triggered it and that still holds focus would be a problem.

What's the difference between this and 2.4.12 Focus Not Obscured (Enhanced)?

2.4.11 (AA) only requires that the focused component is not entirely hidden; partial overlap is allowed. 2.4.12 (AAA) is stricter and requires that no part of the focused component is hidden at all. Most sites target 2.4.11 for AA conformance; 2.4.12 is a higher bar reserved for AAA claims.

Related Success Criteria

2.4.1 Bypass Blocks2.4.2 Page Titled2.4.3 Focus Order2.4.4 Link Purpose (In Context)

Quick Facts

  • Criterion2.4.11
  • LevelAA
  • IntroducedWCAG 2.2

Automate Compliance

AccessiSight automatically scans and identifies 2.4.11 issues in your codebase.

Try Scanner Free