PDA

View Full Version : Gradient Background on This Site


timothydog76
10-16-2007, 02:29 PM
I want to make a background gradient going up the left and right sides of my forum just like this forum. I have no problems making gradients but I don't know where to add them in the style section. Any hints?

Thanks,
Tim

jimbo21
12-01-2007, 02:45 PM
I would like to know this as well. I really like the shadowed look on both sides of the forum.

ChU v2
12-01-2007, 05:48 PM
Sytles & Templates > Main CSS > Body

Standard CSS > Background

Add this:


url(URL OF IMAGE) repeat


vB.org image is this:
https://vborg.vbsupport.ru/images/cstyle/blue/bodybkgd.jpg

But there is tons of way of doing it. (Image wise.)

SBlueman
12-01-2007, 06:10 PM
I do this on my site:

AdminCP > Styles & Template > Style Manager > All Style Options (Choose Which Style)

Then I scroll to the Body section and have this entered in the background field:
#888F97 url(http://gridironfans.com/portal/bg.gif) repeat-x;

jimbo21
12-02-2007, 08:47 AM
Thanks guys. :)

--------------- Added 1196608673 at 1196608673 ---------------

Sytles & Templates > Main CSS > Body

Standard CSS > Background

Add this:


url(URL OF IMAGE) repeat


vB.org image is this:
https://vborg.vbsupport.ru/images/cstyle/blue/bodybkgd.jpg

But there is tons of way of doing it. (Image wise.)

I actually haven't been able to get this to work the way it works on this site.

I know how to repeat an image but the problem I'm having is that the whole background image is showing up and not just the part necessary to fill the window so everything gets shifted to the right.

Is there some other CSS code I can put in to fix this?

ChU v2
12-02-2007, 04:30 PM
Thanks guys. :)

--------------- Added 1196608673 at 1196608673 ---------------



I actually haven't been able to get this to work the way it works on this site.

I know how to repeat an image but the problem I'm having is that the whole background image is showing up and not just the part necessary to fill the window so everything gets shifted to the right.

Is there some other CSS code I can put in to fix this?

Not quite sure what you mean... Screenshot?

They way I do it is take an image 100x100 and just have it repeat.

actone
12-02-2007, 07:04 PM
Vertical repeat:

body {
background: #fff url('images/vertical.gif') repeat-y;
}


Example: http://www.actoneart.com/repeats/vertical.html

Horizontal Repeat:

body {
background: #ffa200 url('images/horizontal.gif') repeat-x;
}


Example: http://www.actoneart.com/repeats/horizontal.html

hope this helps