Как выровнять текст последней строки абзаца

Сегодня я узнал, что есть свойство CSS для выравнивания последней строки отображаемого абзаца — text-align-last. 😲

Сначала я не мог увидеть значение этого свойства, поскольку последняя строка абзаца всегда следует за общим text-align свойством. Если ваш текст выровнен по левому краю, последняя строка также будет выровнена по левому краю. То же самое касается  center и  right.

Итак, в чем дело?

После небольшого исследования я обнаружил, что это свойство может быть полезно для файлов text-align: justify.

Например, макет, подобный приведенному ниже, невозможен без дополнительного свойства CSS.

Благодаря сочетанию text-align и text-align-last такая конструкция становится возможной.

p {
  text-align: justify;
}

p.left {
  text-align-last: left;
}

p.right {
  text-align-last: right;
}