How do I, create a two color body ?

How do I create such body background color ?

How can my body be green and blue for example, but split 1/4 - 3/4, or split at my header limit ? Also compatible with many screen resolution.

See attach images for example.

 

use a background image that is a gradient.

 

create the image with the colors and proportions you want then apply this code to the body

body {

background-image: url(images/background.gif) repeat-x #000000;
}

Code (markup):

you want to make '#000000' the same color as the bottom half of the image as 000... is just black.

I hope this helps

 

You would do something like this.

body {
    background: url(images/backgroundimage.jpg) repeat-x #CCCCCC;
}

Code (markup):

You would make the top part (which is the green part according to you mockup) an image which would only repeat horizontally. Then just assign a color for the rest of the background. Replace #FFFFFF which the color of your choice.

cheers

oh and note that you can combine all the background properties into one line. Short hand CSS

 

you've just repeated what I said...

 

... notice we posted at the same time.

Besides that, You used background-image incorrectly in your code. I assume you meant to use 'background' as the background-image property is only used to set an image path.

 

Thanks to all who helped. Rep added