Problema con FLOAT

hscnet · #1 (**permalink**) 11/04/2007, 04:25

Tengo el siguiente CSS y entre las capas #centrocnt y #centrodch me deja un espacio en blanco que no sé cómo quitar.

Necesito ayuda. Gracias.

CSS

Cita:

body {
margin: 0px;
}
#cabecera {
background-color: Aqua;
height: 100px;
}
#centrosup {
background-color: Blue;
height: 15px;
}
#centroizq {
background-color: Fuchsia;
float: left;
width: 20%;
height: 100%;
}
#centrocnt {
background-color: Gray;
float: left;
width: 60%;
height: 100%;
}
#centrodch {
background-color: Green;
height: 100%;
}
#pie {
background-color: Olive;
height: 15px;
}

HTML

Cita:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
<link href="plantilla.css" rel="stylesheet" type="text/css">
</HEAD>

<BODY>
<div id="cabecera"></div>
<div id="centrosup"></div>
<div id="centroizq"></div>
<div id="centrocnt"></div>
<div id="centrodch"></div>
<div id="pie"></div>
</BODY>
</HTML>

floren · #2 (**permalink**) 11/04/2007, 15:31

Código HTML:

#centrodch {
float:left;
background-color: Blue;
height: 100%;
width: 20%;
}

La lógica es que las capas vayan flotando, incluida #centrodch.

Yo crearía una capa container que alojara las tres centrales, por aquello de que estás diciendo height 100%.

Cuidadín: estás revisando tu diseño con IE6; mejor hazlo con FF y revisa para IEx.

Espero te sirva.