Resolution changes, my background mess up

[optizyme]

Hi folks,

 

I set a background image to my web site in global.css Everything works fine till i tried to change my resolution. Here is my background :

 

http://i.imgur.com/m6oiDk1.jpg

 

As you see, two borders on left and right side. My laptop's resolution is 1366 x 768. I changed to 1024x768 and 1980x1020. Background image messed up the pages. My global.css :

 

body{

font:normal 11px/14px Arial, Verdana, sans-serif;

color:#222;

background-image:url('bgBody.jpg'); 

background-position:top center; 

background-size: contain; 

}

 

How do i adapt my background image to all resolutions?

 

Opti

[PascalVG]

This may help:

http://stackoverflow.com/questions/3147992/set-background-image-according-to-screen-resolution