Imagina una tarjeta preciosa, con fondo bonito, borde redondeado, sombra elegante... y luego el texto aparece pegado a la izquierda como si hubiera llegado tarde y se hubiera sentado donde pudo.
Eso también se diseña.
La propiedad text-align controla cómo se alinea horizontalmente el texto dentro de su caja.
Los valores que más verás son:
left: alineado a la izquierdacenter: centradoright: alineado a la derechaEjemplo:
Todo el texto dentro de .tarjeta se colocará en el centro horizontal.
text-align: center centra el texto, no la caja.
Si quieres centrar un bloque entero en la página, eso ya es otro tipo de problema y se resuelve con otras herramientas, como márgenes automáticos o Flexbox.
CSS está lleno de estas pequeñas trampas: parece que una propiedad hace una cosa... pero en realidad hace una cosa más concreta.
Centrar funciona muy bien en:
Pero en bloques largos de texto suele dificultar la lectura. Un párrafo enorme centrado se siente como leer un pergamino lanzado por el viento.
Haz que la clase .tarjeta tenga text-align: center.
Ordenar el texto también es diseñar...