Playground de text-align en CSS

Explora text-align con controles para dirección de texto y alineación lógica o física. Al usar justify también puedes probar text-justify y copiar el CSS generado.

BaselineLab ayuda a probar propiedades de CSS moderno con controles visuales, una previsualización inmediata y el código listo para copiar en cualquier proyecto web. Cuando cambias la alineación del texto, este párrafo mantiene suficiente longitud para que se aprecie con claridad cómo se distribuyen las palabras en cada línea.

HTML

<div class="text-align" dir="ltr">
  <p>
    BaselineLab ayuda a probar propiedades de CSS moderno con controles visuales,
    una previsualización inmediata y el código listo para copiar en cualquier proyecto web.
    Cuando cambias la alineación del texto, este párrafo mantiene suficiente longitud
    para que se aprecie con claridad cómo se distribuyen las palabras en cada línea.
  </p>
</div>

CSS

.text-align {
  inline-size: min(100%, 36rem);
  min-block-size: 18rem;
  text-align: start;
}