Layout css problemas

Me gustaría que me indicaras como puedo realizar el encaje de las distintas partes de la web como cabecera,menu,
contenidos y pie sin que se me mueva todo de sitio al meter información
o bordes o padding o margin. Lo voy haciendo con un div central
centrado con css y metido dentro lo diferentes secciones anteriormente
descritas con float.
También he probado con posiciones absolutas y no da resultado.
Saludos y gracias de antemano

1 Respuesta

Respuesta
1

Bueno para realizar un sitio debes tener siempre presente el contenedor de la pagina, yo acostumbro a trabajar con un div contenedor de la pagina web(980px de ancho), entonces todas la medidas las tengo que sacar en relación a esa medida, por ejemplo si quiero que un div de encabezado este al lago completo de mi contenedor de 980px, tengo dos opciones o decirle width:100%; o decirle width:980px;, comúnmente ocupo float:left;, para no dejar los elementos flotantes. Otro ejemplo puede ser que en el centro quiera poner dos divs y para que se vean los dos en el centro tendría que calcular el tamaño de los dos, para que se vean en la misma linea y no sobrepasen mi contenedor (980px), ejemplo el div de la izquierda tendrá 280px y el de la derecha tendrá 700px, entonces al sumar eso nos dará 980px y así no sobrepasamos nuestro contenedor.

Si es más o menos lo que yo hago, pero a la hora de meter padding o información dentro de cada parte no varían lo div flotantes?

Si pones contenido dentro de los divs no debería variar el ancho por así decirlo, pero si le pones padding o margin, obviamente te lo altera, porque por ejemplo si temo el ejemplo anterior.

Contenedor : 980px

Div izquierda: 280px

Div derecha: 700px

Con esos dos divs tendría los 980px de mi contenedor, pero si quiero ponerle padding de 10px al div izquierda, ya no serian 280px, sino que 300px, ¿por qué?... porque a los 280 de div le sumamos los 10px del lado derecho y los 10px del lado izquierdo, de la misma manera funciona con el margin o border.

Añade tu respuesta

Haz clic para o

Más respuestas relacionadas