Playground de text-align-last en CSS

Explora text-align-last con controles para dirección de texto y alineación de la última línea o la línea previa a un salto forzado.

BaselineLab compara text-align-last en un párrafo justificado para que la línea final cambie de forma clara.
Este salto manual también permite ver cómo se alinea la línea anterior al br dentro del mismo bloque de texto.
La última línea queda bajo el valor que selecciones.

HTML

<p class="text-align-last-sample" dir="ltr">
  BaselineLab compara text-align-last en un párrafo justificado para que la línea final cambie de forma clara.<br>
  Este salto manual también permite ver cómo se alinea la línea anterior al br dentro del mismo bloque de texto.<br>
  La última línea queda bajo el valor que selecciones.
</p>

Tailwind CSS

Algunas clases con valores arbitrarios pueden sustituirse por clases nativas, según el valor y la configuración de Tailwind CSS.

<p class="max-w-xl text-lg leading-7 text-justify [text-align-last:auto]" dir="ltr">
  BaselineLab compara text-align-last en un párrafo justificado para que la línea final cambie de forma clara.<br>
  Este salto manual también permite ver cómo se alinea la línea anterior al br dentro del mismo bloque de texto.<br>
  La última línea queda bajo el valor que selecciones.
</p>

CSS

.text-align-last-sample {
  max-inline-size: 36rem;
  font-size: 1.125rem;
  line-height: 1.75rem;
  text-align: justify;
  text-align-last: auto;
}