Mortise Test Per Week: Ensure text can be resized via zoom up to 200% without loss of content or functionality (including overlap of text)

CSS-13: Ensure text can be resized via zoom up to 200% without loss of content or functionality (including overlap of text)

How to test

  • Set the device or user agent zoom to 200% and confirm there is no loss of content or functionality (including overlap of text).

Exceptions

How to fix

Use responsive design to ensure that text content reflows, to remain visible and operable within the viewport, at zoom levels up to 200 percent. Media queries defined in `em` or `rem` units respond to increases in page zoom the same as decreases in viewport size. Avoid the use of `overflow:hidden` as much as possible, so that content never becomes clipped by its container, and so that scrollbars can appear to reach content outside the viewport when necessary.

Related Standard: 1.4.4 AA

This is one in a series of posts highlighting one of more than 270 accessibility tests in Mortise.io. Come back next week for more!

Start your free trial of Tenon today!