v145 · CSS · Typography

text-justify CSS property

Chrome 145 adds support for the text-justify CSS property, which controls how text is spread when text-align: justify is in effect. Authors can choose between distributing extra space only between words (inter-word), between individual characters (inter-character), or letting the browser decide (auto). This is essential for East Asian typography where inter-character justification is standard.

concepts

  1. Justification Modes

    Side-by-side comparison of all three text-justify values — auto, inter-word, and inter-character — on the same Latin paragraph. Shows exactly how extra whitespace is distributed in each mode.

  2. CJK and Latin

    East Asian (CJK) text requires inter-character justification — space between every character, not just words. This demo shows text-justify: inter-character applied to Japanese and Chinese text alongside Latin text for comparison.

  3. Script Lab

    The same justification controls applied to Latin, CJK, Arabic, Devanagari, and Thai paragraphs at once. Shows how each script reacts to inter-word vs. inter-character spacing.

  4. Column Width Tester

    Drag a width slider from narrow to wide and compare inter-word vs. inter-character side by side. Shows how narrow columns produce "rivers of white" with inter-word spacing, and why inter-character is preferable for tight magazine-style columns.

  5. Newspaper Layout

    A full print-style newspaper with adjustable column count (2–5) and live text-justify switching. Increase to 4–5 columns to see rivers of white form with inter-word; switch to inter-character to see how it distributes space more evenly. Hyphens toggle included to show how hyphenation interacts with justification algorithms.

why it shipped

The text-align: justify property has existed for decades, but browsers previously chose their own algorithm for distributing extra whitespace. Western (Latin) text is typically justified by expanding gaps between words; East Asian (CJK) text by the convention of the script should be justified by expanding gaps between individual characters. The text-justify property, defined in CSS Text Level 4, gives authors explicit control. Chrome 145 implements this property, allowing developers to enforce inter-character justification for CJK content and explicitly choose inter-word for Latin text regardless of locale defaults.

the values

/* Let the browser choose the best algorithm (default) */
p { text-align: justify; text-justify: auto; }

/* Add space only between words — typical for Latin text */
p { text-align: justify; text-justify: inter-word; }

/* Add space between every character — standard for CJK */
p { text-align: justify; text-justify: inter-character; }

/* Disable justification (useful to override inherited alignment) */
p { text-align: justify; text-justify: none; }

references