Para el diseño que intentas hacer no es necesario posiciones absolutas:
este sería el CSS:
Código:
* {border: 0; margin: 0; padding: 0} /*Para resetear los presets de todos los navegadores*/
body {
width: 650px; /*Ancho del diseño*/
margin: 0 auto; /*Centrado horizontalmente*/
font-family: Arial, Helvetica, sans-serif;
color: #FFFFFF; /*Letra de color blanco*/
}
.arriba {
height:80px; /*alto, al no haber ancho, el ancho de esta clase es automático*/
border:1px solid white; /* borde de 1px de ancho , solido , blanco */
background-color:#CCCCCC; /* color gris*/}
.izquierda
{
width:120px;
height:400px;
border:1px solid white;
background-color:#000066;
float: left;
}
.derecha {
height:400px;
border:1px solid white;
background-color:#666666;
}
y el HTML
Código HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Prueba_estilo</title>
<link rel="stylesheet" href="estilo1.css" type="text/css" />
</head>
<body>
<div class="arriba">Arriba</div>
<div class="izquierda">Iquierda</div>
<div class="derecha">Derecha</div>
</body>
</html>
En todo caso esta es solo una forma de hacerlo, hay miles, ya sabes si tienes dudas, solo pregunta.
Saludos,
PD: No se te olvide la primera línea del HTML, es necesario un DTD para que valide tu CSS, puedes buscar bastante información en google.