Word spacing set with !important in style attributes must be at least 0.16em.

When an HTML element has word-spacing set with !important in its style attribute, and the value is less than 0.16em, users cannot override it with their own spacing preferences. This is a problem because some people need wider spacing between words to read text comfortably.

WCAG Success Criterion 1.4.12 (Text Spacing), at Level AA, requires that users can adjust text spacing properties without losing content or functionality. The four properties covered are line height, paragraph spacing, letter spacing, and word spacing. For word spacing specifically, users must be able to set it to at least 0.16 times the font size.

Many assistive technologies and browser extensions work by injecting author origin styles to override page styles. A style attribute with !important has the highest cascade priority among author origin declarations. This means no other author origin style can override it, and tools that rely on injecting stylesheets to adjust spacing are blocked. Users with dyslexia, low vision, or cognitive disabilities who depend on increased word spacing to parse text are directly affected.

The word-spacing CSS property adds space on top of the default space between words (such as the width of the space character). So a word-spacing value of 0.16em does not mean words are only 0.16em apart; the actual gap is the normal space plus 0.16em. This rule checks the CSS property value, not the total visible gap.

How to fix it

There are two straightforward fixes:

1. Remove !important from the word-spacing declaration so users and assistive technologies can override it.
2. If !important must stay, set the value to at least 0.16em (0.16 times the font size).

Removing !important is almost always the better option. It lets users set whatever word spacing works for them without any upper bound imposed by the page.

Examples

Incorrect: word spacing below the threshold with !important

<p style="word-spacing: 0.05em !important;">
  This text has restricted word spacing that users cannot override.
</p>

The value 0.05em is below 0.16em, and !important in a style attribute prevents assistive technologies from overriding it.

Incorrect: word spacing of zero with !important

<p style="word-spacing: 0px !important;">
  Words are forced to default spacing with no way to increase it.
</p>

Correct: remove !important

<p style="word-spacing: 0.05em;">
  Users can now override this word spacing with their own preferences.
</p>

Without !important, assistive technologies can inject a higher-specificity or later-declared style to override the value.

Correct: set the value to at least 0.16em with !important

<p style="word-spacing: 0.16em !important;">
  This meets the minimum threshold, so the restriction is acceptable.
</p>

The value is at or above 0.16em, which satisfies the minimum word spacing requirement.

Correct: move the style to a stylesheet

<style>
  .spaced-text {
    word-spacing: 0.1em;
  }
</style>
<p class="spaced-text">
  Stylesheet-based styles can be overridden by user or assistive technology stylesheets.
</p>

Styles in a stylesheet, even with !important, are easier to override than inline style attributes with !important because later stylesheets or higher-specificity selectors can take precedence.

Notes

This rule only applies when the element has visible text node children. It does not flag elements that contain no text.

If the page provides its own mechanism for users to adjust word spacing (such as a settings panel), the rule may still flag the issue, but the Success Criterion could be satisfied through that mechanism. Relying on a custom control is less reliable than simply allowing style overrides, since users must discover and operate the control.

Learn more:

W3C Reference

Understanding Success Criterion 1.4.12: Text Spacing

→

W3C Reference

CSS Techniques for WCAG 2.1 - Text Spacing

→

MDN Reference

MDN Web Docs: word-spacing

→