CSS Reference Property

text-align-last

This property describes how the last line of a block or a line right before a forced line break (example: with <br/>, or the line break forced by the end of a <p> tag) is aligned.

If a line is also the first line of the block or the first line after a forced line break, then, unless text-align assigns an explicit first line alignment (via start end), text-align-last takes precedence over text-align.

If the last line is composed of only one word, then justifying that line with text-align-last: justify; will have no effect.

If auto is specified, content on the affected line is aligned per text-align unless text-align is set to justify. In this case, content is justified if text-justify is distribute and start-aligned otherwise. All other values have the same meanings as in text-align.

Official Syntax

  • Syntax:

    text-align-last: auto | start | end | left | right | center | justify
  • Initial: auto
  • Applies To: block containers
  • Animatable: no

Values

start
The same as left if direction is left-to-right and right if direction is right-to-left.
end
The same as right if direction is left-to-right and left if direction is right-to-left.
left
Inline-level content is aligned to the left edge of the line box.
right
Inline-level content is aligned to the right edge of the line box.
center
The inline contents are centered (horizontally) within the line box.
justify

Text is justified according to the method specified by the text-justify property.

The browser adjusts the spacing between words so that the inline content exactly fills the entire line from the left edge of the element to its right edge.

It usually takes the remaining space between the ends of a line’s contents and the edges of its container, and distributes that space throughout its contents so that the contents exactly fill the line box.

auto
Content is aligned per text-align unless text-align is set to justify. In this case, content is justified if text-justify is distribute and start-aligned otherwise. All other values have the same meanings as in text-align.

Examples

The following example will justify the last line of all paragraphs in the page which normally wouldn’t be justified even if text-align: justify is applied.

p {
  text-align: justify;
  text-align-last: justify;
}
                

Browser Support

The text-align-last property is currently only supported in Firefox 12+ and it needs the -moz- prefix.

Notes

The text-align-last property is also supported in IE starting version 5.5, but it does not work in IE8!

Further Reading

Written by

Last updated June 4, 2020 at 4:11 pm by Mary Lou

Do you have a suggestion, question or want to contribute? Submit an issue.