📝 ¿Qué hace text-align en CSS?

La propiedad text-align en CSS se utiliza para alinear el texto (y elementos en línea como imágenes o enlaces) dentro de su contenedor. Es una forma simple y poderosa de controlar la presentación del contenido textual.

📌 Sintaxis básica:

selector {
  text-align: valor;
}

🎯 Valores más comunes:

• left – Alinea el texto a la izquierda (valor por defecto)
• right – Alinea el texto a la derecha
• center – Centra el texto horizontalmente
• justify – Ajusta el texto para que ocupe todo el ancho del contenedor

🧪 Ejemplos:

p.izquierda {
  text-align: left;
}

p.centro {
  text-align: center;
}

p.derecha {
  text-align: right;
}

p.justificado {
  text-align: justify;
}

📷 También funciona con imágenes en línea:

Si colocas una imagen dentro de un contenedor con text-align: center, la imagen también se centrará.

.contenedor {
  text-align: center;
}

<div class="contenedor">
  <img src="imagen.jpg" alt="ejemplo" />
</div>

💡 Tip:

Recuerda que text-align afecta a los elementos dentro de un contenedor, no al contenedor mismo.

📋 Conclusión:

• Usa text-align para controlar la alineación horizontal del contenido textual.
• Ideal para centrar títulos, justificar textos largos o alinear contenido en columnas.