Saludos compañeros,
tengo un problema con la siguiente URL. Me gustaría que la caja amarilla comenzara justo por debajo de las cajas grises (esto lo consigo manejando los márgenes). Su visualización la considero correcta en IE, pero en Firefox, la caja amarilla se ubica por debajo de las cajas grises, cosa que no es lo que deseo.
Aquí tenéis el código utilizado.
(atención que por normativa del foro no he podido incluir el las URLs del Doctype)
Mil gracias por adelantado.
Código:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "">
<html xmlns="">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style>
body {
background-color:#eeeeee;
text-align:center;
font-family: verdana;
font-size: 11px;
line-height: 16px;
}
#principal {
padding: 10px;
margin: 0 auto 0 auto;
width: 600px;
border: solid #000000 1px;
text-align:left;
background-color:#FFFFFF;
}
#uno { background-color:#eeeeee;
width: 250px;
float:left;
margin-bottom: 0px;
position: relative;
height: 50px;
}
#dos { background-color:#cecece;
width: 165px;
float:left;
margin-left: 10px;
margin-right: 10px;
margin-bottom: 0px;
height: 50px;
}
#tres { background-color:#cccccc;
width: 165px;
height: 50px;
float:left;
margin-bottom: 0px;
}
.texto {
margin-top: 20px;
background-color:#ff0;
}
</style>
<title>Tamer</title>
</head>
<body>
<div id="principal">
<div id="uno">aaa</div>
<div id="dos">bbb</div>
<div id="tres">ccc</div>
<div class="texto">esto está en blanco esto está en blanco esto está en blanco esto está en blanco esto está en blanco esto está en blanco esto está en blanco esto está en blanco esto está en blanco esto está en blanco esto está en blanco esto está en blanco esto está en blanco esto está en blanco esto está en blanco esto está en blanco esto está en blanco esto está en blanco</div>
</div>
</body>
</html>