Propriété CSS text-align-last

La propriété CSS text-align-last définit l'alignement de la dernière ligne du texte.

La propriété text-align-last définit l'alignement de toutes les dernières lignes dans l'élément choisi. S'il y a un <div> avec trois paragraphes, text-align-last s'appliquera à la dernière ligne du chaque paragraphe.

Cette propriété est supportée avec un préfixe -moz- pour Firefox 12-Firefox 48, et elle est supportée sans le préfixe pour Firefox 49-Firefox 65.

Valeur initiale	auto
Appliquée à	Conteneurs bloc.
Héritée	Oui.
Animable	Non.
Version	CSS3
Syntaxe DOM	object.style.textAlignLast = "left";

Syntaxe

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

Exemple

<!DOCTYPE html>
<html>
  <head>
    <title>Titre du document</title>
    <style>
      div{
      text-align: justify;
      -moz-text-align-last: right; /* For Firefox prior 58.0 */
      text-align-last: right;
      }
    </style>
  </head>
  <body>
    <h2>Exemple de la propriété text-align-last</h2>
    <h3>text-align-last: right:</h3>
    <div>
      Le Lorem Ipsum est simplement du faux texte employé dans la composition et la mise en page avant impression. Le Lorem Ipsum est le faux texte standard de l'imprimerie depuis les années 1500, quand un imprimeur anonyme assembla ensemble des morceaux de texte pour réaliser un livre spécimen de polices de texte. Il n'a pas fait que survivre cinq siècles, mais s'est aussi adapté à la bureautique informatique, sans que son contenu n'en soit modifié. Il a été popularisé dans les années 1960 grâce à la vente de feuilles Letraset contenant des passages du Lorem Ipsum.
    </div>
  </body>
</html>

Essayez-vous-même!

Un autre exemple, dans lequel les valeurs "start", "justify" et "center" sont comprises:

Exemple

<!DOCTYPE html>
<html>
  <head>
    <title>Titre du document</title>
    <style>
      div.example1 {
      text-align: justify; /* For Edge */
      -moz-text-align-last: start; /* For Firefox prior 58.0 */
      text-align-last: start;
      }
      div.example2 {
      text-align: justify; /* For Edge */
      -moz-text-align-last: center; /* For Firefox prior 58.0 */
      text-align-last: center;
      }
      div.example3 {
      text-align: justify; /* For Edge */
      -moz-text-align-last: justify; /* For Firefox prior 58.0 */
      text-align-last: justify;
      }
    </style>
  </head>
  <body>
    <h2>Exemple de la propriété text-align-last</h2>
    <h3>Text-align-last: start:</h3>
    <div class="example1">
      Le Lorem Ipsum est simplement du faux texte employé dans la composition et la mise en page avant impression. Le Lorem Ipsum est le faux texte standard de l'imprimerie depuis les années 1500, quand un imprimeur anonyme assembla ensemble des morceaux de texte pour réaliser un livre spécimen de polices de texte. Il n'a pas fait que survivre cinq siècles, mais s'est aussi adapté à la bureautique informatique, sans que son contenu n'en soit modifié. Il a été popularisé dans les années 1960 grâce à la vente de feuilles Letraset contenant des passages du Lorem Ipsum.
    </div>
    <h3>Text-align-last: center:</h3>
    <div class="example2">
      Le Lorem Ipsum est simplement du faux texte employé dans la composition et la mise en page avant impression. Le Lorem Ipsum est le faux texte standard de l'imprimerie depuis les années 1500, quand un imprimeur anonyme assembla ensemble des morceaux de texte pour réaliser un livre spécimen de polices de texte. Il n'a pas fait que survivre cinq siècles, mais s'est aussi adapté à la bureautique informatique, sans que son contenu n'en soit modifié. Il a été popularisé dans les années 1960 grâce à la vente de feuilles Letraset contenant des passages du Lorem Ipsum.
    </div>
    <h3>Text-align-last: justify:</h3>
    <div class="example3">
      Le Lorem Ipsum est simplement du faux texte employé dans la composition et la mise en page avant impression. Le Lorem Ipsum est le faux texte standard de l'imprimerie depuis les années 1500, quand un imprimeur anonyme assembla ensemble des morceaux de texte pour réaliser un livre spécimen de polices de texte. Il n'a pas fait que survivre cinq siècles, mais s'est aussi adapté à la bureautique informatique, sans que son contenu n'en soit modifié. Il a été popularisé dans les années 1960 grâce à la vente de feuilles Letraset contenant des passages du Lorem Ipsum.
    </div>
  </body>
</html>

Essayez-vous-même!

Valeurs

Valeur	Description
auto	La dernière ligne est alignée à la gauche .C'est la valeur initiale de cette propriété.
left	Aligne la dernière ligne à la gauche.
right	Aligne la dernière ligne à la droite.
center	Aligne la dernière ligne au centre.
justify	La dernière ligne est justifiée comme les autres lignes.
start	La dernière ligne est alignée au début de la ligne, à la gauche si la direction est de la gauche à la droite et à la droite si la direction est de la droite à la gauche.
end	La dernière ligne est alignée à la fin de la ligne, à la droite si la direction est de la gauche à la droite et à la gauche si la direction est de la droite à la gauche
initial	Fait utiliser la valeur initiale.
inherit	Hérite la propriété de son élément parent.