Este diseño debería quedar así:
Pero me queda asé
Como ven quedan desalineados los recuadros del cuerpo central, en sus 2 columnas.
mi código HTML es éste:
<body>
<div id="contenedor">
<div id="menu">
<div id="logo"> <img src="imagenes/header logo.png" /> </div>
</div>
<div id="contenido">
<div id="contenidocentral" style="float:left"> <img src="imagenes/contenido central bg.png" /> </div>
<div id="cabezerasidebar" > <img src="imagenes/cabezera sidebar bg.png" /> </div>
<div id="sidebar" > <img src="imagenes/sidebar bg.png" /> </div>
</div>
<div id="pie"></div>
</div>
</body>
Y el código css éste:
#menu {
position:absolute;
height:173px;
width:1000px;
top:10px;
left:10px;
background: url(imagenes/header%20bg.png) repeat-y;
}
#logo {
position:absolute;
width: 951px;
height:104px;
top:15px;
left:23px;
}
#contenido {
position:absolute;
background: url(imagenes/contenido%20bg.png);
top:183px;
left:10px;
width:1000px;
height:512px;
}
# contenidocentral {
position:absolute;
top:199px;
left:23px;
height:482px;
width:468px;
}
# cabezerasidebar {
position:absolute;
top:199px;
left:522px;
height:43px;
width:474px;
}
# sidebar {
position:absolute;
width:474px;
height:429px;
top:252;
left:522px;
}
Alguien podría ayudarme?? Gracias