Remove focusable elements from aria-hidden containers

When a keyboard user tabs into an aria-hidden element, the screen reader remains silent, leaving the user with no idea where their focus is or what they can interact with.

Quick Reference

• Elements with aria-hidden="true" must not contain focusable children
• Focusing on a hidden element creates a 'ghost' focus for screen reader users
• Use tabindex="-1" or inert to properly hide interactive elements

Check

Scan aria-hidden="true" containers for focusable elements like links, buttons, or inputs.

Fix

Add tabindex="-1" to focusable children inside aria-hidden containers or use the inert attribute.

Explain