Digital Accessibility Knowledge Base

avoid-inline-spacing

Inline text spacing must be adjustable with custom stylesheets.

Who might be affected
Attention Deficit
Cognitive
Low Vision

Description

People with certain cognitive disabilities or attention deficits may find it hard to track and stay focused on dense text blocks, so they often use browser extensions and other tools that allow them to adjust the text spacing. The objective of this rule is to ensure that people can override author specified text spacing to improve their reading experience. It would be best practice not to space text using inline styling; if there is no other choice, YOU MUST NOT USE THE !important flag so it can be overridden.

Wei also recommends minimum baseline for text spacing.

  • Line height (line spacing) must be at least 1.5 times the font size;
  • Spacing following paragraphs must be at least 2 times the font size;
  • Letter spacing (tracking) must be at least 0.12 times the font size;
  • Word spacing must be at least 0.16 times the font size.

Quick Fixes

Remove every "!important" used on inline styling that sets text spacing.
1

2✗ <p style="line-height: 1 !important; letter-spacing: 5px;">
3    <!-- paragraph content -->
4  </p>
5

6✓ <p style="line-height: 1; letter-spacing: 5px;">
7    <!-- paragraph content -->
8  </p>
9

How Users Are Affected

Users who need to adjust the text spacings to effectively read the text, will not be able to do so.

WCAG Success criteria

This issue might cause elements to fail one or more of the following Success criteria:
1.4.12 Text Spacing (AA)