CSS - problemas propiedad Margin:auto en I.E.

Intento centrar una caja representada por un un DIV que voy a utilizar como contenedor principal (es decir, en ella coloco la cabecera el contenido con 3 columnas y el pie).
El contenedor principal es:

<DIV id="contenedor">
....


Quiero dejar unos márgenes a cada lado del bloque y que este aparezca centrado. Por ello he puesto los siguiente en CSS:

DIV#contenedor {width:80%; margin:0 auto}
en FF me funciona perfectamente centrado y en IE no me respeta el margen izquierdo, vamos, que sale a la izquierda.

tambien he probado a poner todos los márgenes en 2 formatos:

margin:0 auto 0 auto
margin-top:0; margin-right:auto; margin-bottom:0; margin-left:auto

y nada, que no sale centrado, no se donde estoy comentiendo el error

En vista de que nadie me contestaba, y tras varias horas buscando por toda la www sin encontrar nada, hice la "chapuza" (que se ve en muchas paginas supuestamente profesionales) de hacer una tabla de 3 columnas y en la del centro meter el contenido.

Luego encontré la solución:

Yo también he tenido ese problema muchas veces. Para solucionarlo les aconsejo los sig. pasos:

1. Utilizar text-align : center; para el elemento body.

2. Utilizar margin : 0 auto;
text-align : left; para el elemento div que funciona como contenedor.

3. Definir un width : (deseado)px; para el contenedor.

El último punto es el más importante. Debes definir un tamaño para el contenedor
porque sino éste toma el 100% de ancho(width) del navegador. Es decir, el centrado
funciona pero ya que el contenedor abarca el 100% de la pantalla no tiene espacio
para centrarse.

Bueno no, no, un par de años después me hice la misma pregunta y yo mismo la resolví también, pero con otro método: el asunto es que cuando uno utiliza margin:auto debe tener en cuenta varias cosas:

1. Supongamos que se quiere centrar un pequeño bloque o caja DIV, que está encerrada dentro de otras cajas DIV.
El bloque más externo (digamos, un <DIV>) debe tener especificada su anchura, o de lo contrario cobrará la anchura del bloque interno, y así cuando se especifique margin: auto; en el bloque interno (el que se quiere centrar), ¡¡se lo estará centrando dentro de un bloque del mismo tamaño al suyo, porque al bloque externo no se le especificó una anchura!!!

La solución es, pues, para mi caso, fue esa. Comprobé ese comportamiento en Opera.

2. En IE 6.0 también aplica, pero hay que recordar lo que se ha dicho tantísimas veces: para IE 6.0 los centrados se hacen con text-align:center, no con margin:auto.

Saludos, y ojalá le ahorre algunas horas a algún lector.

David L.
Bogotá, Colombia.

ese error en explorer se debe a la falta de definicion de tipo de documento.


con estas lineas al principio del documento debe de funcionar

mas informacion en

www.w3c.org
http://www.forosdelweb.com/forumdisplay.php?f=53

GRACIAS AMIGO, TU CONSEJO ES DE LO MÁS SIMPLE Y SENCILLAMENTE EXPECTACULAR!
GRACIAS DE CORAZÓN. FIRMA, UN NOVATO....

Yo lo solucioné con este código:
en body hay que centrar el texto
y después en el contenedor pones el margen en "auto" y volvés a alinear el texto a la izquierda.

Espero que sirva...

wOW te pasaste

Esto soluciono mi gran duda como principiante:
Adios y mucHAS GRACIAS!

cambia el width:80%; por pixels ejem: