Gradients not working for me.

[scorpio24]

I created a gradient graphic in PhotoShop and copied it into the correct directory on my server. Then I changed the pertinent line in the styles area to change the main color and pointed the URL to the new graphic I created.

Didn't work. All I get is the solid color I specified.

So I know I am overlooking something simple, but I would appreciate if someone would slap me alongside the head with it to save me some time.

Thanks.

I'm getting this exact problem..and I figured it might be the size issue aswell (my custom gradient 100x100 is getting cut off before the second gradient colour kicks in.) My custom gradient gif fades from red at the top to grey at the bottom.

Popup Menu Controls (Customized in this Style)

#C40E0C url(images/gradients/gradient_tcat.gif) repeat-x top left
#C40E0C url(images/gradients/gradient_redgrey.gif) repeat-x top left

I tried both of these after renaming the original tcat.gif didn't work. All I get is the solid #C40E0C colour.

The original tcat.gif is 100x100 also.
The direct link to the gif works, and I pasted from this, so the path isn't the issue.

[scorpio24]

It looks like it is a size issue, because I cropped my custom gif to 100x58 and the grey appeared. Weird. Very much strange also.

[Dilly]

Are you talking about the fact that the image doesn't shrink or stretch to fit exactly in the height of the bar?

For example - if the bar is 30px high, and your image is 100px high, that only the first 30px of the image will be displayed?

If so, that's just the normal behaviour of a css background image. They don't resize themselves to fit, they just tile when they need to be wider/higher.

[scorpio24]

yes..that's what was happening. What confused me was the original vb t_cat gif was 100x100.

[ksfrogman]

I'm getting this exact problem..and I figured it might be the size issue aswell (my custom gradient 100x100 is getting cut off before the second gradient colour kicks in.) My custom gradient gif fades from red at the top to grey at the bottom.

Popup Menu Controls (Customized in this Style)

#C40E0C url(images/gradients/gradient_tcat.gif) repeat-x top left
#C40E0C url(images/gradients/gradient_redgrey.gif) repeat-x top left

I tried both of these after renaming the original tcat.gif didn't work. All I get is the solid #C40E0C colour.

The original tcat.gif is 100x100 also.
The direct link to the gif works, and I pasted from this, so the path isn't the issue.

Excuse my basic lack of knowledge on nomenclature and formats, but when entering the above in the category strips css attributes, is the "url" mentioned above simply the URL address to my webhost that contains the uploaded vBulletin information in it?

[forumguy]

yes..that's what was happening. What confused me was the original vb t_cat gif was 100x100.

It doesn't show the whole of the gradient on the category strips. So if most of your gradient was red at the top, and a little was greay at the bottom, then it would most likely just show the thread.

[aacircle]

It should show the whole height of your gradient and stretch it accordingly. I just upgraded to 3.6.9 and noticed now my gradients appear as full colours, obviously not what I want.

I never made any changes to the gif gradients or CSS, only did the upgrade to 3.6.9.

[peterska2]

Please start your own thread in the relevant forum for the version of vBulletin that you are running.