Skip to main content
Browse documentation

Reflow Audit

WCAG 1.4.10 Reflow requires that content can be used at a narrow width without forcing the reader into two-dimensional scrolling. A low-vision user who zooms to 400%, or anyone on a small screen, should be able to scroll in one direction only and still reach every piece of content and every control.

320 CSS pixels is not an arbitrary phone width. It is the reflow point the criterion defines: a starting viewport of 1280 CSS pixels at 400% zoom.

Most accessibility engines never resize the page. They parse the viewport meta tag or scan CSS for viewport-unit font sizes. This audit narrows the page to 320px and measures whether the document or its elements now require horizontal scrolling.

Turning it on

This audit is experimental: it is off by default while we validate it against more real-world sites. To enable it, open a site’s Settings, and switch on Include experimental audits under Scan settings. The setting is per-site, and applies to every scheduled and manual scan of that site from the moment you save it.

How the audit works

After the page has loaded, the audit:

  1. Captures the current viewport.
  2. Narrows the viewport to 320 CSS pixels wide (unless the scan is already that narrow or narrower).
  3. Waits for layout to settle, so responsive media queries and lazy content have applied.
  4. Measures document-level horizontal overflow and elements that extend past the viewport edge.
  5. Restores the original viewport.

Vertical scrolling is allowed and expected. The failure is a page that, once narrowed, also scrolls sideways.

Reading the results

Violations are confirmed two-dimensional scrolling with a non-exempt offender: a fixed-width layout that never collapses, or an element that pokes past the 320px edge and extends the page horizontally.

Incomplete results are cases the audit will not assert as failures: the page was still changing when measured, overflow sits in the scrollbar-gutter band (a common width: 100vw artefact), or the only signal is a fixed-width container heuristic.

Passes mean the page reflowed at 320px without requiring horizontal scrolling.

Both passing and failing results include CSS selectors and a sample of the element’s HTML when an offender was identified. You can ignore individual elements you have reviewed and accepted using the same ignore feature you use for other issues.

Data tables and other exemptions

WCAG 1.4.10 exempts parts of the content that require two-dimensional layout for usage or meaning. Data tables are the common, legitimate exemption: a wide table that scrolls horizontally at 320px is conforming, and this audit does not flag horizontal scroll inside a <table> or an ARIA grid/table. Layout tables (role="presentation" or role="none") do not get that carve-out.

Other exempt categories include maps and diagrams, video, canvas or game surfaces, slide-style presentations, and pinned toolbars. Intentional in-component scrollers (for example a carousel that scrolls inside its own box without making the page scroll sideways) are not flagged.

Limitations

The audit detects scrollable overflow. Content lost because it is clipped with overflow: hidden rather than scrolled is a genuine 1.4.10 failure that this version does not report. Overflow inside cross-origin iframes is invisible. Overflow inside closed shadow roots can still show up as document-level overflow, but may land in incomplete when it cannot be attributed to a node.

The audit does not claim full 1.4.10 coverage. Whether a given wide element genuinely requires two-dimensional layout for usage or meaning stays a human judgment.