Hola
xfer2:
Cada uno de esos rectangulos que dibujas son divs y estan contenidos por un div "invisible" al que das una id="contenedor" que tiene este aspecto en body...
Código HTML:
<div id="contenedor">
<div id="rectangulo1"></div>
<div id="rectangulo2"></div>
...
<div id="rectanguloN"></div>
</div>
llama esas id en tu
<style> pero antes da un reset y un estilo al body:
Código HTML:
<style type="text/css">
*{margin:0; padding:0;}/*reset básico*/
body {font:Arial; font-size:1em;} /*los estilos que quieras, */
#contenedor {}
#rectangulo1{}
#rectangulo2{}
...
#rectanguloN{}
</style> Luego das dentro de las llaves de tus div "rectangulos" las posiciones que quieres que ocupen los mismos dentro de tu maqueta. Esto lo haces con la propiedad "position"
http://www.librosweb.es/css/capitulo5.html. Aunque te sugiero que antes de entrar a posicionar tus divs practiques con las propiedades "float" y "clear"
http://www.comocrearunsitioweb.com/propiedad-float-css
Saludos!