Background Image and Centre Box

Hello

I want to place a background image on my site, i used 1920x1080

however the image repeats which i don't want, and if i resize the window the centre box moves over the backgorund image.

What i want i the image to scale with which ever size window it is in and not repeat. I also need the centre box to remain fixed so that if someone is vewing the site in a different sized window they can still see the image and the centre box doesn't move.

Any ideas.

Nobody here knows how to fix the Background and centre box so that the centre box does not slide over the image when you scale the window smaller and larger?

Post a link to your site so people can see what you're talking about.

here it is

https://www.gamebeta.co.uk

thanks

The problem is at the moment i am using a repeated image of black-fading-to-white for my background.

However i want to have an image that i can change when new releases come out. The background image however does not scale to the window size, and also the main centre body moves over the images. I want the centre box fixed in the centre and the background image to scale correctly.

The background image will not scale to the window - CSS does not work that way. You already have that repeat controlled, in your body {} rule

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

though you have misplaced the closing ;
You should have there

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

and you probably want

background: url(../images/bg_body.gif) repeat-x #ffffff;

to get the bottom of the page white.

Hi thanks for the response

However i want an image not the black-to-white image i have now.

If you go to another site with an image behind it like;

wwwgamegears.couk (missing two dots on purpose "www." and .co.uk)

When you scale the window you will see that the image and centre box stay fixed. On my site if i put in an image similar to the one here, then the imgae stays in position but the centre box just slides over the top of it making some parts of the image visable that shouldn't be, and some hidden that shouldn't be.

ANy ideas how to repeat this effect?

background: url(../images/bg_body.gif) no-repeat #000000 top center;