Content must reflow at 320 CSS pixels without horizontal scrolling
People with low vision zoom in to 400%, which makes the page as narrow as a small phone. When tables, product galleries or fixed-width sections do not fit, they have to scroll sideways for every line, which makes reading product details and comparing prices exhausting.
- Rule id
- vs-reflow
- Source
- Validiscan check
- Impact
- Serious
- Fix tier
- ASSISTED
- on Shopify, Shopware, WooCommerce and Magento
- Status
- runs
What the check does
Renders pages at a width of 320 CSS pixels (the equivalent of 400% zoom) and flags content that forces horizontal scrolling or is cut off (1.4.10).
At each scan viewport, by default 1440 or 390 px wide, the check resizes the page to 320 by 480 CSS px, waits two animation frames plus 250 ms, measures and restores the viewport. In the mobile context, a page whose missing or fixed-width viewport meta tag keeps a wider layout gets one finding on html instead.
Otherwise it reports, widest first and at most 10 per page, boxes ending more than 2 px past the viewport’s inline end edge while their ancestors fit, and fitting elements whose own text does not wrap and runs past that edge. It ignores tables, grids, maps, role="application", aria-hidden content and empty boxes.
When the page scrolls sideways and nothing else is reported, html gets the finding, unless a table, grid, map or role="application" region overflowed. Content cut off by overflow-x: hidden on the page is still reported. Content hidden at 320 px, or held in its own scroll or clip container, is skipped.
How to fix it
Replace fixed widths with max-width: 100% and flexible layouts, let long words and URLs wrap (overflow-wrap: anywhere), let wide tables scroll inside their own container, and make sure no element sets a minimum width above 320 pixels.
WCAG success criteria
- 1.4.10 Reflow, level AA
EN 301 549 clauses
| WCAG criterion | Version 3.2.1 | Version 4.1.1 |
|---|---|---|
| 1.4.10 | 9.1.4.10 | 9.1.4.10 |
Start with a free check of your shop.
Send your shop’s address. Validiscan scans it and replies with every failure the scan can prove, with the page and the code.
Request a free checkOr write to info@validiscan.com.
What the free check covers, and what it leaves out- You send
- your shop’s address
- Pages scanned
- up to 15
- You get
- every failure the scan can prove, with the page and the code
- On your shop
- public pages only; no login, nothing bought, no forms sent
- What it is not
- a full audit