Hoy en el trabajo, tenía que crear una sencilla página HTML que contenía tablas y estas tenían que estar centradas en la página.
Quería hacerlo en CSS, más que nada para no mezclar el contenido con la presentación. Creía que la cosa sería un momento y me he puesto manos a la obra:
1. He añadido a un fichero CSS la siguiente definición:
div.centrado{
text-align: center;
}
2. En mi fichero HTML he añadido:
<div class=»centrado»><table>…</table></div>
y, para mi sorpresa, solo me centraba la tabla Internet Explorer. Ni Firefox ni Netscape han centrado la tabla. Entonces, he buscado a través de Google cual era mi fallo estrepitoso (je je) y me he encontrado con un artículo en inglés sobre como centrar tablas con CSS.
De todas las soluciones que ofrece me he quedado con la siguiente:
div.centrado{
text-align: center;
}
div.centrado table {
margin: 0 auto;
text-align: left;
}
que ha centrado mi tabla tanto en Internet Explorer como en Firefox y Netscape. Además el artículo comenta que de esta manera también se centran las tablas para el resto de navegadores (hay un caso puntual que no se centra en el Internet Explorer de los Mac). Me ha parecido la mejor solución de todas las que en ese artículo se comentan.
Espero que a alguno os sirva de solución por si os encontrais con el mismo problema.
¡Gracias! Llevaba una semana buscando esta información. Lo malo es que la página de theodorakis no funciona, pero con lo que has resumido me ha servido 😉
Me alegro de que te haya servido Paul! 😉
Un saludo!
Me parece un buen articulo, me aclaro muchas dudas gracias
deje de andar en andadera (deje mi keygenerator o generador de codigo) y me puse a caminar (nada mas que un editor de textos) y este tema me tenia loco desde hace un rato… gracias, esta bueno… que por que deje mi keygen??? es sencillo, no hacia la maquetacion de la forma en que queria, es decir mostraba el contenido tal y como yo queria, pero no usaba mas que div’s y no me gusto eso… pero bueno. lo siguire usando por que trae cosas utiles como por ejemplo te genra un low resolution de la imagen que quieras… trae el ftp que me gusta usar y cosas asi, pero desde ahora solo yo pongo el codigo… a mano.
perfecto el centrado de la tabla, el problema que tengo es que estoy metiendo swf a la plantilla centrada y me cuadra bien pero al momento de ver la prueba en ie se corre a otro lado, mejor dicho no queda en el sitio q lo coloque
ola genial era justo lo q buscaba gracias por publicarlo
🙂
Me sirvio muxo!!
Excelente, tenía que hacer lo mismo y tu ayuda me ayudó mucho.
Un abrazo!
Gracias!
Me ha ayudado en verdad!
Lo correcto es…en el archivo css etiqueta table {margin: auto;}
Gracias muy bueno fuiste lo primero y lo mejor ke encontre googleando
buenisimo el articulo gracias era justo lo q estaba buscando.se agradece
Sencillo y efectivo. Muchas gracias, me ahorraste horas de seguir buscando.
Muy bueno!!!!
Muchas Gracias!.
Muy escueto y resumido… muy bien ^^
Gracias me tenía loco este problema una solución Excelente.
Hola, muchas gracias por la información me fue de muchísima ayuda. Llevaba todo el día intentando solucionar este problema. Muchísimas Gracias.
Tiene razón.
lo mejor es en la css
table {margin: auto;}
uhh gracias muy bueno me solucionooo la vida… gracias grande
La paz
Muchas gracias
Gracias por pasar el dato.
Muchas Gracias, ya me estaba frustrando, por que centraba la tabla y se desorganizaban todo lo demás (fotos, formularios, etc..).
Te agradezco mucho por el código que me llego de perlas.
Gracias por compartir tus conocimientos
muchísimas gracias por la aportación, llevaba unos días buscando la solución y no era capaz. Gracias
gracias felizmente encontre este post a tiempo.
Gracias machin!!
Gracias por el Tip men, me fue de gran utilidad.
Muchas gracias! Bueno, bonito, barato!