Skip to content
SilktideHelp

Text spacing

Silktide finds elements whose inline styles lock their text spacing - letter-spacing, word-spacing, or line-height - with !important at a value below the WCAG minimum, so users cannot adjust it.

Why this matters

People with dyslexia or low vision often need text spread out to read it: taller lines, wider gaps between letters and words. They do this with browser extensions and custom stylesheets that override a page's spacing.

Those tools inject ordinary author-level CSS. An !important declaration inside an element's style attribute beats every author-level rule, no matter how specific - it is the one construct on a page those tools cannot override. When it locks spacing below the minimums, the user is simply shut out.

success criterion 1.4.12 (level AA) requires that content survives users raising text spacing to at least:

  • Line height - 1.5 times the font size
  • Letter spacing - 0.12 times the font size
  • Word spacing - 0.16 times the font size

How to fix it

For each flagged element, do one of the following:

  1. Remove the !important flag from the inline declaration. Users' tools can then override it, and your design is unchanged for everyone else.
  2. Move the declaration into a stylesheet. Even with !important, stylesheet rules can be overridden by user tools.
  3. Raise the value to the WCAG minimum if the spacing genuinely must be pinned.
<!-- Fails: locked below the minimum; user tools cannot override this -->
<p style="line-height: 1.2 !important">…</p>

<!-- Fixed: overridable -->
<p style="line-height: 1.2">…</p>

<!-- Also fine: locked, but at a value that already meets the minimum -->
<p style="line-height: 1.5 !important">…</p>

How Silktide tests this

  1. Find elements whose style attribute declares letter-spacing, word-spacing, or line-height with !important, and that directly contain visible text.
  2. Resolve the declared value against the element's font size.
  3. Report the element when the locked value is below the WCAG minimum for that property.

This mirrors the W3C ACT rules for 1.4.12 (letter spacing, word spacing, line height).

Silktide does not flag !important spacing in stylesheets - user tools can still override those - and does not simulate applying the spacing overrides to detect broken layouts, which no automated tool currently does. Passing this check means nothing on the page blocks users from adjusting spacing; testing that your layout stays readable with adjusted spacing is a quick manual test with a text spacing bookmarklet.

Troubleshooting

The inline style comes from a framework or third-party widget

Component libraries and embed scripts sometimes write inline !important styles. They count against your page all the same; check the vendor's settings or raise it with them.

The spacing is locked at a compliant value

Values at or above the WCAG minimums pass even when locked - locking line-height: 1.6 !important harms nobody, because it already exceeds what users would raise it to.

Learn more

Last updated

Was this page helpful?

Text spacing | Silktide Help