Text spacing needs to be adjustable

• Rule: axe/avoid-inline-spacing
• Checks: Inline text spacing must be adjustable with custom stylesheets
• WCAG: 1.4.12
• Fix class: mechanical: A fix needs no authored text or visual decision.

Who it affects

• People with low vision, who zoom, magnify or need strong contrast.
• People with cognitive, learning or attention disabilities.

How to fix it

An inline style sets line-height, letter-spacing or word-spacing with !important

Remove !important from the declaration. Text-spacing bookmarklets and many extensions add their spacing as page styles, which an inline !important value outranks, so people cannot widen the spacing.

<p style="line-height: 1.4; letter-spacing: 0.01em">Orders placed before noon ship the same day.</p>

The declaration must keep !important

Set it at or above the spacing people may ask for: line-height of at least 1.5, letter-spacing of at least 0.12em and word-spacing of at least 0.16em. axe accepts an !important value that meets these.

Fixes that fail

Moving the same !important declaration into a stylesheet

axe checks only style attributes, so the rule passes, but a specific !important rule in a stylesheet still beats the broad page styles that bookmarklets and similar tools add.

Removing !important while the text’s container keeps a fixed height

Wider spacing can then push the text out of its box, where it is clipped or overlaps other content, which fails WCAG 1.4.12. Test with the spacing applied, and let the container grow, with min-height or no height at all.

More on the rule

axe-core’s documentation of the rule

CORA’s fix guidance adapts content from accessibility-agents, under the MIT License: see its notice.