Antes que nada gracias por tomarse el tiempo de leer esto.

Estoy haciendo un diseño muy muy simple, que en Mozilla Firefox, Safari, Opera y Konqueror se ve justo como yo quiero que se vea, pero... en IE6 e IE7 ¡todo se arruina! Por favor entren a la página http://rmf.fciencias.unam.mx/~cnf/ con IE y luego con cualquier otro, para que mírenlo ustedes mismos, el marco negro es la etiqueta body y el marco rojo es un div de "Contendio" que no debería tener ese espacio a la izquierda entre body.
Les explico la estructura del documento y si entran a la página cada div esta enmarcado:
Código HTML:
 <body> <!-- enmarcada en negro --> <div id="Contendio"> <!-- enmarcada en rojo --> <div id="Cabeza">Bla, bla...</div> <!-- enmarcada en verde --> <div id="ColumnaIzquierda">Bla, bla...</div> <!-- enmarcada en amarillo --> <div id="ColumnaDerecha">Bla, bla...</div> <!-- enmarcada en cian --> <div id="ColumnaCentro">Bla, bla...</div> <!-- enmarcada en magenta --> <br class="BorraFloat"/> <div id="Pies">Bla, bla...</div> <!-- enmarcada en azul --> </div><!-- Fin Contenido --> </body>
Código:
  
Por favor, no les pido que me den la solución exacta (si la tiene mejor * { /* Pone todo a cero */
        margin:0;
        padding:0;
}
body {
        margin: 0;
        padding: 0;
}
#Contenido {
        margin: 0;
        padding: 0;
}
#Cabeza {
        margin: 0;
        padding: 0;
        overflow: auto; /* arregla el largo de la caja para el contendio flotante */
}
#ColumnaIzquierda {
        float: left;
        width: 11em;
}
#ColumnaDerecha {
        float: right;
        width: 11em;
}
#ColumnaCentro {
        margin: 0 12em 0 12em;
}
#Pies {
        margin: 0;
        padding: 0;
}
.BorraFloat {
        clear: both;
        height: 0;
        font-size: 0px;
        line-height: 0px;
}
 ). Sólo que me oriente sobre este bug de IE para poder resolverlo.
). Sólo que me oriente sobre este bug de IE para poder resolverlo.Muchas gracias y saludos a todos!!
 
 
 ayuda con bug en IEs
 ayuda con bug en IEs 


