Paragraphs & wrapping
text-justify
text-justify decides where extra space goes when justified text (text-align: justify) is stretched to the full width: only between words, or between characters.
Syntax
auto | none | inter-word | inter-characterPreview
The quick brown fox jumps over the lazy dog. 素早い茶色の狐がのろまな犬を飛び越える。
Presets
Drag the bottom-right corner to resize
Code
.box {
text-align: justify;
text-justify: inter-character;
}Controls
text-justifyChrome, Edge, and Firefox only (no effect in Safari)inter-character
The quick brown fox jumps over the lazy dog. 素早い茶色の狐がのろまな犬を飛び越える。
About
Values
auto: the browser picks a method that suits the script and language, typically between words for English and between characters for Japanese. This is the initial value.none: turns justification off, for example in a user style sheet for readability.inter-word: widens only the spaces between words. It suits languages that separate words with spaces, such as English; a Japanese line without spaces is not stretched.inter-character: widens the gaps between all characters, including the letters of English words.
It only has an effect when text-align is justify, so the preview on this page adds text-align: justify as a supporting declaration. The last line is not justified in the first place, so it does not change.
Not in Safari
Chrome and Edge (version 145 and later) and Firefox support it. In Safari every value behaves like auto. The legacy keyword distribute means the same as inter-character, but this page leaves it out.