1. css
  2. /properties
  3. /text-align-last



The text-align-last property adjusts the alignment of the last line of a block element or the line just before a forced line break. It could prove useful when handling justified text, offering distinct alignment options for the final line that may differ from the rest of the text block.

Examples and Usage

In the example below, we apply different text-align-last values to a paragraph. We start by setting text-align to justify and text-align-last to auto. Then, we'll sequentially apply center, end, and justify values and discuss their effects.

HTML Structure

  In Arrow Functions, the return statement is implicit when the body of the function consists of a single expression. In such cases, you don't need to use the return keyword, and the expression itself will be returned by the function.

CSS Styling

p {
  font-size: 1.2em;
  text-align: justify;
  text-align-last: auto; /* Behaves as 'start' when 'text-align' is 'justify' */

With text-align-last set to auto, the last line alignment follows the text-align value. However, since text-align is set to justify, the auto value behaves as if text-align-last is start.

Now, let's apply other values.

text-align-last: center; /* Centers last line */
text-align-last: end; /* Aligns last line to the right in LTR, left in RTL */
text-align-last: justify; /* Adjusts text spacing for line box edge alignment */

If we apply these values to the paragraph, the center value would center-align the last line, end would align it to the right for left-to-right direction (and to the left for right-to-left direction), and justify would adjust the text spacing so that the start and end of the last line align with the line box edges.


The text-align-last property accepts the following values:

autoThe affected line is adjusted according to the text-align value unless it's justify; then it behaves as if text-align-last is start.
startAdjusts alignment to the left if direction is left-to-right, and to the right if it's right-to-left.
endAdjusts alignment to the right if direction is left-to-right, and to the left if it's right-to-left.
leftAligns the inline content to the left edge of its containing line box.
rightAligns the inline content to the right edge of its containing line box.
centerAligns the inline content centrally within the line box.
justifyAdjusts word spacing so that the inline content lines up with the left and right edges of the line box.

Associated Properties

  • text-align
  • text-justify

Tips and Tricks

  • Justifying a single word line with text-align-last: justify will have no visible effect as there is no additional space to distribute.

  • Note that when text-align is set to justify and text-align-last to auto, the behavior is as if text-align-last is set to start.

  • If you're working with multilingual websites, be mindful that text-align-last: start and text-align-last: end will behave differently based on the text direction. In right-to-left languages like Arabic or Hebrew, start aligns the last line to the right, while end aligns it to the left.

Browser Compatibility

Older versions of Firefox (12-48), require vendor prefixes for proper functioning. IE supports text-align-last when text-align is set to justify, and has no support for the start and end values. For a more detailed breakdown, refer to the first link in the Useful Resources below.

BrowserChromeEdgeSafariFirefoxOperaInternet Explorer

Caution: Internet Explorer support data may be incorrect since MDN browser-compat-data no longer updates it. Also, early Edge versions used EdgeHTML, leading to mismatched version numbers. From version 79, Edge uses Chromium with matching version numbers.

Useful Resources

Can I use: text-align-last

W3C's Working Draft of CSS Text Module Level 3: text-align-last