WordPress: Centrado de celdas y tablas

¿Alguien necesitó centrar una tabla pequeña en una entrada de WordPress?. Yo. Me costó tiempo y desesperación conseguirlo, pero lo hice. Todas las tablas me salían alineadas a la izquierda. Había probado mil códigos (align=”center”, <table align=”center” …, etc) y me seguían saliendo a la izquierda. En la vista de “diseño” me salía centrada pero sin embargo, si pinchaba sobre la tabla, aparecían cuatro cuadritos (como si marcaran las 4 esquinas) a la izquierda de la tabla, como si una tabla invisible estuviera a su izquierda. Me llegué a preguntar si es que no se podrían poner tablas centradas o si es que tenía algún problema con WordPress.
Pues bien, al final di con el resultado. Sin mas vueltas os lo dejo a continuación…

<div aling=”center”>
<table style=”width:75%;border:1px;”>

</table>
< /div>

Ya sabéis que donde están puestos los puntos suspensivos es donde tenéis que crear las filas (<tr>) y las columnas (<td>), según vuestras necesidades.
 
Por otro lado me costó mas de cinco horas poder conseguir una alineación vertical en una celda que estaba realizando para este mismo blog. Buscarla en Google solo me llevó perdida de tiempo. Después de probar un montón de opciones di con la correcta y ahora la pongo al público para que si pasas por aquí teniendo esa necesidad o gusto puedas usarla. Es sencilla:
 
style=”vertical-align:middle;”
 
Concretamente yo lo use en <td width=”50%” style=”text-align:center;vertical-align:middle;border:solid 1px #000000;”>.
 
Muchos elementos HTML tienen el atributo align=”center” para centrar el contenido. No obstante más elegante es usar un atributo de estilo: style=”text-align:center”. Este atributo se puede usar con cualquier elemento de HTML. Si no tiene sentido, entonces se ignora igual como el atributo align.
 
Dentro de una celda de una tabla puedes usar también un alineamiento vertical style=”text-align:center; vertical-align:middle” para ajustar un texto en el centro de la celda. No obstante hay que tener en cuenta que el tamaño de una celda se ajusta a su contenido y que una celda puede cambiar el tamaño con el tamaño de la tabla que la contiene.
 
En términos generales, el centrado sólo tiene efecto si el tamaño del elemento HTML es mayor que su contenido, es decir si tiene especificado algún tamaño (width and height). Algunos elementos tienen este comportamiento por defecto. Por ejemplo, un div tiene por defecto un width=”100%”. En cambio, hay que especificarlo para otros elementos como la celda de una tabla td.
 
Para ver el tamaño de cada elemento yo suelo poner el estilo style=”border:solid 1pt #000000″ con que se muestra un marco alrededor de cada elemento. Así ves el área que el contenido tiene disponible. #000000 indica el color del borde, que lógicamente puedes ponerle el que quieras.
 
Saludos.

Volver al menú de WordPress Volver al menú de Páginas Web Volver al menú de Internet Volver a Inicio

* Bases de información obtenidas de ayudawp.com y de la web de trucos informáticos

Anuncios