WCAG 1.4.12 — Text Spacing, explained with examples

Why this criterion exists

Users with dyslexia or low vision install browser extensions to expand text spacing. Sites that break under those rules lock those users out.

If you only remember one thing: when users override line height to 1.5×, paragraph spacing to 2×, letter spacing to 0.12×, and word spacing to 0.16×, no content or functionality must be lost. Everything else on this page is detail.

Who feels it when this fails

Accessibility criteria sometimes feel abstract until you see who pays the cost when a site ignores them. Text Spacing affects:

• Dyslexia users

• Low-vision users

How sites typically fail it

These are the patterns we see week after week. None are intentional — they are accidents of how teams build interfaces under deadline. Knowing the failure modes is the fastest path to writing them out of your component library.

• Fixed-height text containers cropping content when spacing increases

How to test for it

• Apply WCAG 1.4.12 bookmarklet; nothing should clip or overlap.

A code fix you can copy

Use min-height instead of height so containers can grow when users expand text.

.card { height: 100px; overflow: hidden; }

.card { min-height: 100px; }