[Ovillo] IE no dibuja bien las capas

Vie Nov 3 11:48:49 UTC 2006

Hola,

Estoy trabajando en la siguiente web:
http://www.efeyl.org/pruebas/EFEYLBATALLITAS/index.php

En Firefox se ve perfectamente, tal y como debería verse según el código
escrito. La estructura del sitio es más o menos así:

<body>
  <div id="todo">
    <div id="banner"></div>
    <div id="borde_cuadros"></div>
    <div id="menuycuerpo">
      <div class="menu"></div>
      <div id="cuerpo">
        <div class="contenedor">
          <div class="texto"></div>
        </div>
      </div>
      <div id="pie"></div>
    </div>
  </div>
</body>

Sin embargo en IE ignora la capa "menuycuerpo" por completo. Se nota porque
el menú no tiene separación con el banner, y el cuerpo está a otra altura
distinta. Además, no sé por qué misteriosas razones, no se dibujan los
bordes superiores del contenido bien. Copio y pego aquí la hoja de estilos,
por si a alguien le interesa:

* html,body {
    height:100%;
    margin:0px;
    padding:0px;
}

body {
background-color:#000044;
background-image:url(imagenes/fondo.gif);
color:#f1e9c9;
font-family:Georgia, "Times New Roman", Times, serif;
font-size:90%;
}

    #todo     {
        height:100%;
        min-height:100%;
        position:relative;
        margin: 0px auto;
        }

        #banner {
        width:100%;
        background-color:#4C0909;
        text-align:center;
        }

        #borde_cuadros{
        background-image: url(imagenes/fondo_cuadros.gif);
        background-repeat:repeat;
        height:16px;
        }

        #pie {
        bottom:0;
        position:absolute;
        height:100px;
        width:100%;
        }

            #pie_inferior {
            background-color:#4C0909;
            padding: 5px 0px 5px 0px;
            bottom:0;
            }

        #menuycuerpo{
        padding-bottom:120px;

        }

        #cuerpo{ /*Lo que suele ser en otros diseños 'principal*/
        margin-left:160px;
        }

            .contenedor { /*La caja que contiene texto y demases */
            background-color:#004400;
            border: 3px double #d0af34;
            margin: 20px;
            }

                .texto { /*El interior de la caja contenedor*/
                padding: 10px 15px 10px 15px;
                }

.subtit {
color: #99FF66;
}

.importante {
font-weight:600;
}

#pie h2 {
color: #d0af34;
font-family : Georgia, "Times New Roman", Times, serif;
}

#pie_inferior .elemento {
margin:20px 90px 20px 90px;
font-size:75%;
}

A:link{
color:#D0AF34;
text-decoration: none;
}

A:active{
color:#D0AF34;
text-decoration: none;
}

A:visited{
color:#D0AF34;
text-decoration: none;
}

A:hover{
color:#8A8AFF;
text-decoration: none;
}

.contenedor h2 {
color:#d0af34;
background-color:#4c0909;
border-bottom:3px double #d0af34;
margin: 0px;
padding: 5px 15px 5px 15px;
text-transform:uppercase;
font-family:felix titling, georgia, "times new roman", times, serif;
text-align:center;
}

.contenedor h4 {
color:#d0af34;
font-family:felix titling, georgia, "times new roman", times, serif;
}

.proximo {
margin:40px 60px 40px 60px;
font-style:italic;
}

p {
margin:12px 0px 12px 0px;
}

li {
margin:12px 0px 12px 0px;
}

.gallerytitle {
color:#d0af34;
font-family:felix titling, georgia, "times new roman", times, serif;
font-size:120%;
}

/* ESTILO DEL MENU */

.menu {background-image:url(imagenes/menu/fondo.gif);}

.menu img {border:0px; margin-bottom:-4px; padding:0px;}

table {border-collapse:collapse; border:0; margin:0; padding:0;}

.menu ul li a.hide, .menu ul li a:visited.hide {display:none;}
.menu ul li a:hover ul li a.hide {display:none;}

.menu ul li a:hover {color:#fff;
background-image:url(imagenes/menu/fondo.gif); background-color:#b3ab79;}
.menu ul li a:hover ul {display:block; position:absolute; top:0; left:147px;
width:150px;}
.menu ul li a:hover ul li a.sub {background:#dfc184; color:#000;}
.menu ul li a:hover ul li a {display:block; background:#b3ab79; color:#fff;
width:150px;}
.menu ul li a:hover ul li a ul {visibility:hidden;}
.menu ul li a:hover ul li a:hover {background:#dfc184; color:#000;}
.menu ul li a:hover ul li a:hover ul {visibility:visible; position:absolute;
left:151px; top:0; color:#000;}
.menu ul li a:hover ul li a:hover ul li a {display:block; width:200px;
background:#dfc184; color:#000;}
.menu ul li a:hover ul li a:hover ul li a:hover {background:#bd8d5e;
color:#fff;}

-- 
************************************
Nidia Fernández Martínez
Alhana, Alhanita, Nahriah...
http://alhanita.blogspot.com
************************************