css 3

Icon

A comprehensive CSS 3 reference guide, tutorial, and blog
Are you a CSS expert? Want to contribute? Contact us

CSS TEXT-JUSTIFY

This property appears to offer a refinement on the “justify” value used in the ‘text-align’ property. Indeed, the “justify” value must be set for that property for ‘text-justify’ to have any effect.

‘Text-justify’ offers a fine level of justification control over the enclosed content, allowing for a variety of sophisticated justification models used in different language writing systems.

 

Example

div { text-align: justify; text-justify: newspaper }

<div style=”text-align: justify; text-justify: newspaper”>This is “Newspaper” justified content</div>

 

Possible Values

Value Description
auto The browser will determine the appropriate justification algorithm to use
distribute Justification is handled similarly to the “newspaper” value, but this version is optimized for East Asian content (especially the Thai language.) In this justification method, the last line is not justified.
distribute-all-lines Behavior and intent for this value is the same as with the “distribute” value, but the last line is also justified.
inter-cluster Justifies content that does not have any inter-word spacing (such as with many East Asian languages.)
inter-ideograph Used for justifying blocks of ideographic content. Justification is achieved by increasing or decreasing spacing between ideographic characters and words as well.
inter-word Justification is achieved by increasing the spacing between words. It is the quickest method of justification and does not justify the last line of a content block.
newspaper Spacing between letters and words are increased or decreased as necessary. The IE reference says “it is the most sophisticated form of justification for Latin alphabets.”

 

7 Responses

  1. rolf says:

    i glanced something that said
    text-justify:kashida
    for arabic texts…. dont know more about it… i just oversaw it in a search result

  2. dendi says:

    thanks..i try yo learn about css n this blog give me good lesson, i hope this blog will improve more and more..thanks again

  3. [...] way to do this is with the auto keyword on the padding or margins of the title, and not using a text-justify declaration (since the title only has one line of text which fits snugly in its own content box).  [...]

  4. [...] when you have only one line, justification does nothing. With CSS3, there’s a property called text-justify that lets you specify how you want the text justified. Using text-justify: distribute-all-lines, [...]

  5. Jono says:

    I believe this is an invalid CSS2 property and is not fully supported

  6. Xamuel says:

    Huh, cool, I never thought about how justification must be really tough to pull off for spaceless languages like Japanese.

    Suggestion for the article: why not add some actual example textboxes using the various types of justify?

Leave a Reply

Pages

Sponsors


CSS3.com



Please help CSS3.com stay alive and running

Bad Behavior has blocked 1108 access attempts in the last 7 days.