CSS3 text-justify Property
Example
Justification changes spacing between words:
div
{
text-align: justify;
text-justify: inter-word;
}
Try it yourself »
Definition and Usage
The text-justify property specifies the justification method to use when text-align is set to "justify".
This property specifies how justified text should be aligned and spaced.
| Default value: | auto |
|---|---|
| Inherited: | yes |
| Animatable: | no. Read about animatable |
| Version: | CSS3 |
| JavaScript syntax: | object.style.textJustify="inter-word" |
Browser Support
The numbers in the table specify the first browser version that fully supports the property.
| Property | ||||||
|---|---|---|---|---|---|---|
| text-justify | Not supported | 12.0 | 5.5 | Not supported | Not supported | Not supported |
CSS Syntax
text-justify: auto|inter-word|inter-ideograph|inter-cluster|distribute|kashida|trim|initial|inherit;
Property Values
| Value | Description | Play it |
|---|---|---|
| auto | The browser determines the justification algorithm | Play it » |
| inter-word | Increases/Decreases the space between words | Play it » |
| inter-ideograph | Justifies content with ideographic text | Play it » |
| inter-cluster | Only content that does not contain any inter-word spacing (such as Asian languages) is justified | Play it » |
| distribute | Spacing between letters and words are increased or decreased as necessary | Play it » |
| kashida | Justifies content by elongating characters | Play it » |
| trim | Play it » | |
| none | The justification is disabled | Play it » |
| initial | Sets this property to its default value. Read about initial | Play it » |
| inherit | Inherits this property from its parent element. Read about inherit |
