CSS text-align-last property

Definition and Usage

The text-align-last property specifies how to align the last line of text.

Please note that the text-align-last property sets the alignment of all the last lines within the selected element. Therefore, if a <div> contains three paragraphs, text-align-last will apply to the last line of each paragraph. To use text-align-last on the last paragraph within a container, you can use :last child. See the following example.

Note:In Edge/Internet Explorer, the text-align-last property only applies to text with "text-align: justify".

See also:

CSS Tutorial:CSS Text

HTML DOM Reference Manual:textAlignLast Property

Example

Align the last line of the three <div> elements:

div.a {
  text-align: justify;  /* For Edge */
  text-align-last: right;
}
div.b {
  text-align: justify; /* For Edge */ 
  text-align-last: center;
}
div.c {
  text-align: justify; /* For Edge */ 
  text-align-last: justify;
}

Try it yourself

More TIY examples can be found at the bottom of the page.

CSS Syntax

text-align-last: auto|left|right|center|justify|start|end|initial|inherit;

Property Value

Value Description
auto

Default Value. The alignment rule for each line is determined by the value of text-align.

When the value of text-align is justify, the behavior of text-align-last is the same as setting start.
left The last line is aligned to the left.
right The last line is aligned to the right.
center The last line is centered.
justify The beginning of the last line of text is aligned with the left side of the content box, and the end is aligned with the right side.
start

The last line is aligned at the beginning of the line.

If text-direction is from left to right, it is left-aligned, and if text-direction is from right to left, it is right-aligned.
end

The last line is aligned at the end of the line.

If text-direction is from left to right, it is right-aligned, and if text-direction is from right to left, it is left-aligned.
initial Sets this property to its default value. See: initial.
inherit Inherits this property from its parent element. See: inherit.

Technical Details

Default Value: auto
Inheritance: yes
Animation creation: not supported. See:Animation-related properties.
Version: CSS3
JavaScript Syntax: object.style.textAlignLast="right"

More Examples

Use text-align-last: on the last line in the container

div.b p:last-child {
  text-align-last: center;
}

Try it yourself

Browser Support

The numbers in the table indicate the first browser version that fully supports this property.

Numbers with -moz- indicate the first version using the prefix.

Chrome IE / Edge Firefox Safari Opera
47.0 5.5* 49.0
12.0 -moz-		 not supported 34.0

The "start" and "end" values are not supported in Edge/Internet Explorer.