Hola antes que nada.
Mi problema viene cuando intento que una capa, que esta debajo de dos capas a modo de columnas posicionadas con float, se desplace hacia abajo cuando estas crezcan, y aqui tanto IE7 como Firefox me hacen algo extraño. Tras haber limpiado el float para que chocaran con un div situado por debajo,
una de ellas sigue atravesandolo, concretamente la de la derecha.
Dejo el código HTML:
Código PHP:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" type="text/css" href="style.css" />
<title>Documento sin título</title>
</head>
<body>
<div id="global">
<div class="info_top">
<p> Blizzlike Status: Fun Status: </p>
</div>
<div id="container">
<div id="h_logo"><img src="top1(3).png" alt="" width="1000" height="250" /></div>
<div id="block_left">
<p><img src="bg_h_block.png" alt="" width="160" height="25" /></p>
</div>
<div id="cont_txt">
<div id="cont_txt_top"></div>
<div id="cont_txt_body">
<p>Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto v Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto Texto texto </p>
<p> </p>
</div>
<div id="cont_txt_bottom"></div>
</div>
<div class="antiflote"></div>
<div class="metal_line"></div>
</div>
</div>
</body>
</html>
Y el CSS:
Código PHP:
/* CSS Document */
* {margin:0; padding:0;}
html {height:100%;}
body {height:100%; background:#000 url(bg_body.jpg) top left repeat-x;}
p{font-family:"Times New Roman", Times, serif; font-size:13px;}
#global {height:100%; width:100%;}
#container {
width:1000px;
height:100%;
margin:auto;
padding-top:40px;
}
#h_logo{height:250px; margin-bottom:20px;}
#block_left {
float:left;
width:180px;
height:100%;
padding-right:20px;
background:url(bg_left_block.jpg) repeat-y right;
}
#cont_txt {float:right; width:800px; height:100%;}
#cont_txt_body {text-align:justify; background:url(bg_con_txt.gif) repeat-y;}
#cont_txt_body p {color:#660000; padding:0px 45px 0px 45px;}
#cont_txt_top, #cont_txt_bottom {height:36px; background:url(bg_b_top.gif) no-repeat;}
#cont_txt_bottom {background:url(bg_b_bottom.gif) no-repeat;}
/* bloque anti-flote */
.antiflote {clear:both; height:0px;}
.info_top {width:100%; height:23px; text-align:center; background-color:#000000;}
.info_top p {
color:#CCCCCC;
font-size:10px;
font-weight:bold;
padding-top:5px;
}
Llevo horas peleandome con esto y no consigo darle solucion, sigo sin entender por que una de las capas sigue atravesando la capa de abajo.
Gracias de antemano.