Skip to main content
Accessibility.com, LLC
Category: Visual and Media Accessibility

Reflow

Simply put

Reflow is the ability of content to rearrange itself so it fits within a smaller screen or a zoomed-in view without forcing the user to scroll in two directions to read it. This helps people who enlarge text or use small screens read content by scrolling in only one direction. In web browsers, the term can also refer more generally to the process of recalculating the position and layout of page elements.

Formal definition

In the accessibility context, reflow refers to the presentation of content in a way that allows it to be resized or presented at reduced viewport dimensions without loss of information or functionality, and without requiring scrolling in two dimensions for the primary reading direction. Reflow describes the rearranging of electronic text and layout as features such as type size, line length, and spacing vary. In front-end web development, the term reflow is also used to describe the browser's recalculation of the position and geometry of parts of a webpage, such as after an interactive update. Note that this term is distinct from unrelated uses of "reflow," such as reflow soldering in electronics manufacturing. This entry is general guidance and not legal advice; specific conformance targets and testing methods should be confirmed against current WCAG documentation and, where relevant, qualified counsel.

Why it matters

Reflow directly affects whether people who need to enlarge content can actually read it. When a user zooms in or views a page on a small screen, content that does not reflow can force scrolling in two directions at once, both horizontally and vertically, to follow a single line of text, which is difficult and error-prone for many users, particularly those with low vision. Content that reflows into a single column or otherwise adapts to the available space allows reading by scrolling in only one direction, reducing this burden.

Because reflow supports resizing and reduced viewport dimensions without loss of information or functionality, it is closely tied to how usable a site is across the wide range of devices and zoom settings people actually use. A layout that appears complete at full width but breaks, clips, or hides content when magnified can leave users unable to access information or complete tasks. Meeting reflow expectations is one factor in a broader accessibility effort; conformance with any single success criterion does not by itself guarantee an accessible experience or immunity from legal claims.

Note that "reflow" is used in more than one sense. In front-end development it can refer generally to the browser recalculating the position and geometry of page elements after an update, and the same word appears in unrelated fields such as reflow soldering in electronics manufacturing. In the accessibility context, the relevant meaning is the rearrangement of content so it fits smaller or zoomed views without two-dimensional scrolling. This entry is general guidance and not legal advice; confirm specific conformance targets and testing methods against current WCAG documentation and, where relevant, qualified counsel.

Who it's relevant to

Front-end developers
Developers implement layouts that adapt to smaller screens and zoomed views so content rearranges rather than forcing two-dimensional scrolling. Because "reflow" in a browser context also describes the recalculation of element position and geometry after interactive updates, developers should be clear about which sense they mean when discussing performance versus accessibility behavior.
UX and visual designers
Designers shape how text and layout respond as type size, line length, and spacing vary. Designing for reflow means ensuring information and functionality remain available when content is enlarged or presented in a narrower space, rather than relying on a fixed wide layout.
Accessibility testers and QA teams
Testers evaluate whether content can be resized and viewed at reduced viewport dimensions without losing information or requiring scrolling in two directions. Automated checks detect only a portion of issues, so manual testing and testing with assistive technology and zoom settings are generally needed to confirm reflow behavior.
Users who enlarge content or use small screens
People who increase text size, zoom in, or rely on small displays benefit directly from reflow, which lets them read by scrolling in a single direction instead of tracking text across two axes.
Compliance and accessibility program leads
Those overseeing accessibility efforts should treat reflow as one element within broader conformance and usability goals. Requirements evolve through WCAG documentation, regulation, and case law, so specific targets should be confirmed against current standards and, where relevant, qualified counsel.

Inside Reflow

Reflow (WCAG Success Criterion 1.4.10)
A Level AA success criterion added in WCAG 2.1 requiring that content can be presented without loss of information or functionality, and without requiring scrolling in two dimensions, at specified dimensions. It was not part of WCAG 2.0.
Two-dimensional scrolling
Reflow generally aims to prevent users from having to scroll both horizontally and vertically to read a line of text or use content. Content that requires two-directional scrolling for its primary purpose is the core problem the criterion addresses.
Target dimensions
The criterion is commonly described in terms of content reflowing to a viewport equivalent to 320 CSS pixels wide for vertical scrolling content and 256 CSS pixels tall for horizontal scrolling content, which corresponds to a high level of zoom on a standard desktop display.
Exceptions for essential presentation
Parts of content that require a two-dimensional layout for usage or meaning may be exempt. Examples often cited include data tables, complex images, maps, diagrams, toolbars, and certain interfaces where the spatial arrangement is essential.
Relationship to zoom and responsive design
Reflow supports users who magnify content or use small viewports. Responsive design techniques and relative units are commonly used to help content adapt so it remains usable when enlarged.

Common questions

Answers to the questions practitioners most commonly ask about Reflow.

Does meeting the Reflow success criterion mean my content is fully accessible?
No. Reflow (WCAG 2.1 Success Criterion 1.4.10, Level AA) addresses one specific aspect: presenting content without loss of information or functionality, and without requiring scrolling in two dimensions, at defined viewport dimensions. Satisfying this criterion does not guarantee an accessible experience for all users, nor does it address other success criteria. Conformance with a single criterion should not be treated as evidence of full accessibility or of legal compliance. Manual testing and testing with assistive technologies remain necessary, and automated checks detect only a portion of potential issues.
Is Reflow just another name for responsive design?
Not exactly. Responsive design is a general development approach, while Reflow refers specifically to WCAG 2.1 Success Criterion 1.4.10, which sets particular expectations about content adapting to defined viewport dimensions without loss of information or functionality and without two-dimensional scrolling. Responsive techniques are commonly used to help satisfy Reflow, but a site can be responsive in a general sense and still fail specific aspects of the criterion. The criterion, not the design methodology, defines what is being tested.
Which WCAG version and conformance level does Reflow belong to?
Reflow is Success Criterion 1.4.10 and was introduced in WCAG 2.1 at Level AA. It is not present in WCAG 2.0. It carries forward into WCAG 2.2. Because AA is the level most commonly cited as a conformance target, Reflow is generally in scope for organizations aiming at that level.
What viewport dimensions are used when testing Reflow?
The criterion is framed around presenting content without requiring two-dimensional scrolling at defined viewport dimensions specified in WCAG 2.1. Testing generally involves resizing or setting the viewport to those dimensions and confirming that content and functionality remain available without needing to scroll in both directions. Consult the current W3C text of Success Criterion 1.4.10 for the precise dimensional values and exceptions.
Are there any exceptions to the Reflow requirement?
Yes. The criterion allows for certain content that requires two-dimensional layout for usage or meaning, such as some data tables, images, maps, or interfaces where two-directional presentation is essential. The exact exceptions are defined in the W3C text of Success Criterion 1.4.10, which should be referenced directly rather than paraphrased, since exception language is precise.
How should Reflow be tested in practice?
Reflow generally involves both technical and manual verification: adjusting the viewport or zoom to the defined conditions and confirming that no information or functionality is lost and that content does not require scrolling in two dimensions. Automated tools may flag some layout issues but do not fully verify this criterion, so manual inspection is required. As with all accessibility work, this guidance is not legal advice, and specific requirements may evolve through regulation and case law.

Common misconceptions

Reflow is a requirement in all versions of WCAG.
Reflow (1.4.10) was introduced in WCAG 2.1 at Level AA and is not present in WCAG 2.0. It is also carried forward in WCAG 2.2. Which version applies depends on the standard or benchmark being referenced in a given context.
Any horizontal scrolling on a page fails the Reflow criterion.
The criterion is generally concerned with content requiring scrolling in two dimensions at the specified target dimensions. Content that legitimately requires a two-dimensional layout for its use or meaning, such as data tables or maps, may fall under the recognized exceptions.
Meeting Reflow means the site is fully accessible and legally compliant.
Reflow is a single success criterion. Conformance with it does not guarantee an accessible experience for all users, nor does meeting WCAG guarantee immunity from legal claims. Automated tools detect only a portion of issues, so manual and assistive technology testing are also needed. This is not legal advice.

Best practices

Test content by zooming to the equivalent of a 320 CSS pixel viewport width (commonly around 400% zoom on a typical desktop) and verify that text and functionality remain usable without two-dimensional scrolling.
Use responsive design techniques and relative units so content adapts to smaller viewports and higher magnification rather than forcing a fixed layout.
Reserve two-dimensional layouts for content where spatial arrangement is genuinely essential, such as data tables, maps, or complex diagrams, and document why an exception applies.
Combine automated checks with manual testing and assistive technology testing, since reflow behavior and loss of content or function are not fully detectable by automated tools alone.
Confirm which WCAG version and conformance level your project targets, since Reflow applies from WCAG 2.1 Level AA onward and is not present in WCAG 2.0.
Consult qualified legal counsel and current agency rulemaking when determining which standards apply to your organization, as requirements evolve through regulation and case law.