Fondo de una pagina Web

georgegarcia · #1 (**permalink**) 11/04/2011, 13:12

Que tal como estan? Saludos, kisiera saber si alguien conoce como realizar fondos corridos en diferentes secciones, asi como este ejemplo: [URL="http://cognition.happycog.com/" target="_blank"]http://cognition.happycog.com/[/URL] vean como cada sección presenta un fondo diferente y no el clasico fondo del body, si no cada div, gracias `por la ayuda

C2am · #2 (**permalink**) 11/04/2011, 13:22

Simplemente le pones un fondo a cada div

georgegarcia · #3 (**permalink**) 11/04/2011, 15:18

Esa parte si la entiendo pero si te das cuenta en el ejemplo el fondo se extiende a lo ancho de la pantalla, eso es lo que no se como se hace, gracias por la ayuda.

kike2lucas · #4 (**permalink**) 11/04/2011, 16:18

Cada div está metido en otro div con un ancho al 100%; el div que está dentro tiene un ancho menor, centrado con la propiedad margin (margin: 0 auto;). El div superior y el del medio (los que van al 100%) tienen una imagen de fondo, mientras que el div con los contenidos tienen un color de fondo, un borde (propiedad border) y un sombreado:
box-shadow: 0 0 15px rgba(122, 122, 122, .4);
-moz-box-shadow: 0 0 15px rgba(122, 122, 122, .4);
-webkit-box-shadow: 0 0 24px rgba(122, 122, 122, .4);

Muy lindo, pero estas propiedades no funcionan en Internet explorer. Miralo en explorer y vas a ver como cambia el diseño

dragonvm · #5 (**permalink**) 12/04/2011, 13:01

Puedes hacer que el estilo en IE sea diferente con algunos hacks :S

#6 (**permalink**) 13/04/2011, 08:51

no hace falta ponerle un fondo a cada div, sino al body o al contenedor como prefieras e incluir también el header dentro del contenedor, al que luego le aplicarás un margin: 0 auto; para centrarlo en cualquier navegador que uses y después de probarlo nos comentas para poder ver el tema del fondo como lo quieres.

suerte!