Gradient background

LPH

Well-known member
How do I get a gradient background?

I'm using General -> Body -> Background Settings

Xen Gradient Setttings.PNG

But this doesn't seem to work. The x is correct but the y doesn't go the full distance down the screen.
 

Brogan

XenForo moderator
Staff member
If you want it to repeat in both directions then select Repeat.

If the gradient doesn't extend as far as you want, use an image with a larger height.
 

LPH

Well-known member
Thank you. I lengthened the image and now have to match colors better.
 

Lykke

Well-known member
I don't want to create a new thread for this, so sorry to use this one ;)

I have a bg picture on repeat on a forum. It's light green with dark flowers. I want the page itself to have a gradient from dark in the bottom to normal light in the top.

When I try doing the above, my background image disappear...

I am having the image in the HTML though, but it doesn't matter if I place it there or in the body, the result is the same.

Hope you can help =) Thanks
 

Jake Bunce

XenForo moderator
Staff member
Can you post a URL to your forum so I can see the problem?

Maybe the background image is being covered by the header area. Also note that the HTML background is normally covered by the Body background unless your body is a fixed width.
 

Jake Bunce

XenForo moderator
Staff member
And you want the gradient to overlay this image?

http://www.guppylifeforum.com/styles/GuppyLife/BG.jpg

You can do that by adding a gradient image to the Body class. But the image will need to have transparency so the green image shows through. A PNG image with transparency will do it. There are some images in this directory you can try:

styles/default/xenforo/overlay
 

Lykke

Well-known member
Thanks Jake :) That was actually a thought I had too - but if I do it like that, and the image is set to repeat, wont it add some differences in the gradients?

The end result should be as close to the main page as possible, which you can see here (with gradient):

www.guppylife.com
 

Lykke

Well-known member
Hm yes, just hoped I could add the gradient with the piece of BG I had on repeat lol.

Well, I just get that image from them instead =)Probably easier lol

Thanks a bunch ^^

EDIT: And done :) works.
 
Top