Description
This rule determines if the page has a scrollbar horizontally and vertically. The content should be presented without loss of information or function, and without requiring scrolling in two directions.
Purpose
Text may need to be resized for some users with visual impairments to read it comfortably. Users shouldn’t have to scroll in their browser in more than one direction – horizontally and vertically – when enlarging content up to 400% of its default size.
If your website uses responsive web design, which reflows content to match the user’s viewport, it may already be compliant with this standard.
How to fix it
- Ensure vertical content doesn’t require a horizontal scroll at a width of
320 CSS pixels.Note:
320 CSS pixelsis the same as a default viewport of 1280 pixels enlarged 400%. - Ensure horizontal content doesn’t require a vertical scroll at a height of
256 CSS pixels.Note:
256 CSS pixelsis the same is a default viewport of 1024 pixels enlarged 400%.
Exceptions
- Where multi-directional scrolling is essential for meaning or function (for example images, maps, diagrams, games, whiteboards, and components that require toolbars to remain in view)
- Complex data tables
Standard
Accessibility, WCAG 2.1, Success Criterion 1.4.10 Reflow