dos colores en el body

[gabo2287]

quiero dividir mi body de modo a que un 30% tenga un color en la parte de arriba, y el resto el 70% abajo que tenga otro color, y que ocupe el ancho 100% de la pantalla.

Tengo la etiqueta body y dentro un contenedor donde pongo todo, pero si pongo un div ahi dentro ese div toma el tamaño del contenedor (max-widht: 1200px) y yo quiero que esos colores ocupen lo que seria todo el body, pero dividido en dos colores..uno arriba y otro abajo

espero haberme explicado, no consigo hacerlo de las maneras que intento

[GekoDH]

A mí sólo se me ocurre darle al body un background hecho con un gradiente.

Algo así:

background: linear-gradient(top, #d60c42 30%, #9dd53a 30%, #80c217 30%, #a1d54f 30%);

Lo generé con esta herramienta: http://www.colorzilla.com/gradient-editor/

Espero que te sirva.

[moginn]

http://jsfiddle.net/darronz/g1nvgj10/

[siddartha23]

Código CSS:

body
{
background: linear-gradient(to bottom, #aebcbf 0%,#aebcbf 30%,#0a0e0a 31%,#0a0809 100%);
} /* W3C */
 

[alzacon]

¿Y qué es lo que tienes?

El problema con body lo tienes en su alto que por defecto es auto, vienendo a ser el alto de su contenido.

Por cierto para el gradiente no hace falta dar tantas veces los colores, con esto basta:

Código CSS:

background: linear-gradient(#bbb 30%, #333 30% );
 

[3sk0rp10n]

A mi solo se me ocurre que metas dos div, uno con un 70% del body y otro del 30%. Eso si, el corte de colores será fuera de todo el contenido. Luego juega con el padding para ajustarlo a tu gusto.

También cabe decir que el corte de color se verá mucho, si eso no lo quieres mejor lo que te han dicho, color con gradient.

Saludos!