Roles must be contained by their required context role

Rule aria-required-parent · ARIA · impact serious · Static + live

↩ Back to the rules index · WCAG cross-reference

Why it matters#

A role="option" outside a listbox, or a role="tab" outside a tablist, has no valid context and won’t be operated as part of the widget.

How to fix#

Nest the role inside (or aria-owns it from) an element with the required context role.

Example#

<div role="option">A</div>

<div role="listbox"><div role="option">A</div></div>

Example#

<div role="tab">A</div>

<select><option>One</option><option>Two</option></select>

WCAG success criteria#

1.3.1 Info and Relationships — Level A#

Structure and relationships conveyed visually (headings, lists, tables, labels, groups) must also be available programmatically.

Understanding 1.3.1

Standards#

This rule contributes to the following standards:

WCAG A EN 301 549

References#

• WAI-ARIA — Required Context