Hola a todos bueno el problema es el siguiente, tengo un contenedor, de fondo blanco, y una maquetacion a 3 columnas, bueno resulta lo siguiente, el contenedor toma solo el tamaño de la columna central, que es la unica que no es float. entonces no me da el fondo blanco para todo el lugar que necesito
ACLARO ESTO SOLO SUCEDE EN FIREFOX Y CHROME, en IE funciona bien.
estos son los div en CSS
PINTO LA COLUMNA IZQUIERDA DE CELESTE PARA QUE SE VEA LA DIFERENCIA CLARAMENTE, EN REALIDAD VA SIN FONDO, Y EL BLANCO SE LO DEBIERA DAR EL CONTENEDOR
Código:
/*CONTENEDOR*/
#sombracont{
width:770px; height:auto; margin:auto;
background-image:url(images/fondo.png); background-repeat:repeat-y;
}
#contenedor{
width:750px; margin:auto; height:auto;
background-color:#FFFFFF;
border-left:#666666 solid 1px; border-right:#666666 solid 1px;
}
/*COLUMNAS*/
#izquierda{
float:left;
margin:0;
width:175px; height:auto;
background-color:#00CCFF;
font-size:11px; border-right:#666666 solid 1px;
}
#derecha{
float:right;
width:150px; height:auto;
margin:0;
}
#centro{
vertical-align: top middle;
margin-left:180px;
width:415px; height:auto;
}
/*PIE*/
#pie{
width:750px; height:auto; margin:auto;
text-align:center;
background-color:#FFFFFF;
border-right:#666666 solid 1px; border-left:#666666 solid 1px;
}
#sombrapie{
width:770px; height:auto; margin:auto;
background-image:url(images/fondo.png); background-repeat:repeat-y;
}
De paso aprovecho el pie en Chrome y Firefox se ve separado del contenedor eso no deberia pasar, en IE no pasa. La idea es que se vea como se ve en IE pero en Firefox y Chrome
Internet Explorer 7:
Firefox:
Google Chrome:
bueno creo que se ve claramente lo que quiero decir, espero puedan ayudarme
asi tengo los Divs enel html (no pongo la cabecera porque no es el problema)
Código:
<div id="sombracont">
<div id="contenedor">
<div id="izquierda">
</div>
<div id="derecha">
</div>
<div id="centro">
</div>
</div>
</div>
Saludos y gracias desde ya a quien pueda ayudarme.