- Success Criterion 1.4.12
- Conformance level AA
Text Overlapping the Section Below After Spacing Changes
1.4.12 — Text Spacing
Scenario
Setting
A fitness app's workout tracker
What’s wrong
Text overlapping following sections because ancestors use fixed heights.
Example
Consider a fitness app's workout tracker: text overlapping following sections because ancestors use fixed heights.
Why it matters
People with dyslexia or low vision who apply extra text spacing to read. On a fitness app's workout tracker, that means they miss information conveyed only by color.
How to test
Apply the text-spacing override and scroll: if enlarged spacing pushes text into the section below (fixed-height ancestors), causing overlap, it fails.
How to fix
With user text-spacing overrides applied (line height 1.5, paragraph 2x, letter 0.12em, word 0.16em), all content and controls must remain visible and usable.
Outcome
With the fix in place on a fitness app's workout tracker, they tell the information apart without relying on color.
Who is affected
People with dyslexia or low vision who apply extra text spacing to read.
Learn more
- Understanding Understanding document (opens in a new tab)
Related scenarios
- Text That Clips or Overlaps Under User Text-Spacing Settings
- Fixed-Height Container Clipping Text at Wider Line Spacing
- Author CSS Blocking the User’s Own Text-Spacing Stylesheet
- Button Label That Vanishes Under Increased Text Spacing
- Tooltip or Dropdown That Truncates Under Text-Spacing Overrides
- JavaScript Truncation That Deletes Content on Text-Spacing Change