Día 50: CSS Table Alignment
La ruta del desarrollador web frontend autónomo🤹♂️
Table of contents
Alineación horizontal
La propiedad text-align
establece la alineación horizontal (left
, right
o center
) del contenido en <th>
o <td>
.
Por defecto, el contenido de los elementos <th>
están alineados al centro y el contenido de los elementos <td>
están alineados a la izquierda.
Para alinear al centro el contenido de los elementos <td>
, usa text-align: center
Ejemplo:
Para alinear el contenido a la izquierda, fuerce la alineación de los elementos <th>
para que se alineen a la izquierda, con la propiedad text-align: left
Ejemplo:
Alineación vertical
La propiedad vertical-align
establece la alineación vertical (top
, bottom
o center
) del contenido en <th>
o <td>
.
Por defecto, la alineación vertical del contenido de una tabla es a la mitad (<th>
y <td>
).
El siguiente ejemplo establece la alineación vertical del texto hacia abajo para los elementos <td>
:
Ejemplo:
Resumen
La propiedad text-align
establece la alineación horizontal (left,
right
o center
) del contenido en <th>
o <td>
. La propiedad vertical-align
establece la alineación vertical (top
, bottom
o center
) del contenido en <th>
o <td>
. Por defecto, la alineación horizontal de <th>
es al centro y la de <td>
es a la izquierda. La alineación vertical por defecto es a la mitad. Los ejemplos muestran cómo cambiar la alineación horizontal y vertical.
Traducido con 💚 desde W3Schools.com