Forums / Templates, Stylesheets, Page Layout / Background Image and Centre Box

Background Image and Centre Box

Locked
Results 1 to 8 of 8
This thread is locked. New replies are disabled.
11 Aug 2010, 09:01
#1
darrenq avatar

darrenq

New Zenner

Join Date:
Apr 2010
Posts:
78
Plugin Contributions:
0

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.
16 Aug 2010, 12:55
#2
darrenq avatar

darrenq

New Zenner

Join Date:
Apr 2010
Posts:
78
Plugin Contributions:
0

Re: Background Image and Centre Box

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?
16 Aug 2010, 15:15
#3
captainpicard avatar

captainpicard

New Zenner

Join Date:
Aug 2010
Posts:
8
Plugin Contributions:
0

Re: Background Image and Centre Box

Post a link to your site so people can see what you're talking about.
17 Aug 2010, 11:57
#4
darrenq avatar

darrenq

New Zenner

Join Date:
Apr 2010
Posts:
78
Plugin Contributions:
0

Re: Background Image and Centre Box

here it is

www.gamebeta.co.uk

thanks
17 Aug 2010, 12:44
#5
darrenq avatar

darrenq

New Zenner

Join Date:
Apr 2010
Posts:
78
Plugin Contributions:
0

Re: Background Image and Centre Box

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.
17 Aug 2010, 14:14
#6
gjh42 avatar

gjh42

Black Belt

Join Date:
Jul 2005
Posts:
21,876
Plugin Contributions:
6

Re: Background Image and Centre Box

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.
17 Aug 2010, 17:51
#7
darrenq avatar

darrenq

New Zenner

Join Date:
Apr 2010
Posts:
78
Plugin Contributions:
0

Re: Background Image and Centre Box

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?
18 Aug 2010, 13:00
#8
gjh42 avatar

gjh42

Black Belt

Join Date:
Jul 2005
Posts:
21,876
Plugin Contributions:
6

Re: Background Image and Centre Box

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