Interface Lab

Reflow without two-dimensional scrolling

Content should remain intact at 320 CSS px without page-level two-dimensional scrolling, even when experimental visual effects are enabled.
LayoutSupportedPriority 7Applied in the lab

Sources

  • StandardW3C (2024)

    Content must reflow at the equivalent of 320 CSS px without two-dimensional scrolling.

    “Content can be presented without loss of information or functionality, and without requiring scrolling in two dimensions”SC 1.4.10 (AA)

In this lab

Measured evidence: a 24-route lab sweep at 320 px had no overflow, and demo 007 passed at 320, 375, and 1280 px.

Priority

Applicable to every lab page and demo, and automatically testable.

Experiments

Findings

Supported

At a 320 px test stage, the reflow and reflow-plus-effects variants had 0 px overflow, no overflowing or clipped components across replications and viewports, and accessible keyboard-scroll regions, even with experimental ambient, clipped 140% strip, and sticky bar. The fixed-width control failed all metrics (+308 px; 5/5 overflowing components; clipped card text; 47 stray elements). A separate 24-route lab sweep at 320 px found no horizontal page scrolling.