dudas de maquetacion en css

[JHMorales]

Hola:
para que todo se quede relativamente quieto te aconsejo no usar padding, si acaso margin que da menos problemas (creo), en todo caso debes comenzar tu css así:
* {margin:0;padding:0;}
con esto anulas todos los margin y padding que los diferentes navegadores ponen cada uno a su manera y por defecto.

Luego ya puedes empezar a poner las cosas con position:absolute, teniendo en cuenta que comenzarás a contar las coordenadas desde la esquina superior izquierda de la ventana del navegador.

Los diseños líquidos trabajan con dimensiones en % del width que se está manejando. Si el width del div mayor o del body es 100% ocupa el ancho de la ventana del navegador sea cual sea la resolución, si es el 90% pues el 90. Pero si hay dentro de ese body o de ese div mayor un div que sea del 30% ocupará ese porcentaje del div en el que está contenido, adaptándo lo que esté dentro (texto, etc.) a ese ancho.

En cuanto a las capas y los divs, estos son como cajas de texto (o imagen) que contienen párrafos, títulos, imágenes, enlaces, etc. que tu los acomodas en tu diseño. Pero si necesitas que uno se solape sobre otro tienes que darle al que va arriba un z-index mayor para que se monte. En esto entra en juego el flujo html, si no le dás posición a tus divs estos se situan uno a continuación del otro, por lo cual debes indicar la posición por medio de coordenadas. En position:absolute designas el sitio con respecto a la esquina superior iazquierda de la ventana y en el caso de position:relative con respecto el sitio en donde debería aparecer según el diseño.

El float hace que el elemento se situe en la dirección que dice el float (left o right) y en el espacio que sobra se situe el siguiente div.

Suerte, Jorge H.