Probad este código:
Código:
<HTML>
<HEAD>
<TITLE> Bloques con CSS </TITLE>
<style type="text/css">
body {color:#000000; background-color:#000000; margin-top:5px; margin-left:5px}
#cabecera {
background-color:#cccccc;
height:60px;
width:710px;
}
#separacion {
background-color:#000000;
width:710px;
height:1px;
}
#anchocuerpoprincipal {
width:710px;
}
#cuerpoprincipal {
position:relative;
background-color:#000000;
height:100px
}
#menuizq {
position: absolute;
background-color:#FF3366;
width:152px;
height:60px;
}
#celdaprincipal {
position:absolute;
background-color:#66CC66;
height:100px;
left:157px;
width:408px;
}
#menudch {
position: absolute;
background-color:#0033CC;
height:40px;
right:0px;
width:140px;
}
#piedepagina {
width:710px;
height:60 px;
background-color:#FFCC00;
}
</style>
</HEAD>
<BODY>
<div id="cabecera">
Cabecera
</div>
<div id="separacion">
</div>
<div id="anchocuerpoprincipal">
<div id="cuerpoprincipal">
<div id="menuizq">
Menu izquierdo
</div>
<div id="celdaprincipal">
Celda principal
</div>
<div id="menudch">
Menu derecha
</div>
</div>
</div>
<div id="separacion">
</div>
<div id="piedepagina">
Piedepágina
</div>
</BODY>
</HTML>
Todo funciona bien menos los bloques de separación entre la cabecera y el cuerpo principal y éste y el pie de página. No se queda una separación de 1px, como "ordena" en el código. ¿Por qué? ¿se puede arreglar? Asiasssssssssss por adelantado.
<a href="http://www27.brinkster.com/granadalinks/"><img border="0" src="http://www27.brinkster.com/granadalinks/ban468.gif" width="468" height="60"></a>