I am trying to replace the existing background of Marinelli and apply a blue to white gradient. I've already tried to apply one and it worked but because the gradient was only 800 pixels long, it "restarted" another gradient below 800 pixels. Then I tried to apply a longer gradient but the gradient was too stretched out. I want to apply a relatively compact gradient and then have it stay white after 800 pixels instead of "restarting" in blue. Anyone know how to do this? Thanks.

Comments

dman’s picture

dman commented

Basic CSS

doubleeater’s picture

doubleeater commented

Gee, thanks for the snarky reply. But you must not have read the question carefully. I don't want to repeat the gradient. I want to make it transition from blue into white and have the image stay white instead of starting over from blue again. Anyone else?

dman’s picture

dman commented

The instructions are on that page background-repeat:no-repeat. Although you probably want background-repeat:repeat-x.
I get snarky when people don't even look at the documentation...

doubleeater’s picture

doubleeater commented

Did you understand the quetsion? I went to your link and I don't think you do. The question is how do you make the gradient so that it will stay on the transition color instead of restarting back in the original color? For example, I have a blue to white gradient background. If the uploaded gradient file in the image folder is only 800 pixels tall, then after 800 pixels, it will repeat to the original blue. I want it to stay white after 800 pixels. I used an online gradient creator and most of them only allow 800 pixel in height. By using "repeat-x" (which is what I've been using from the beginning), after the 800 pixels in height, the colors will start over again.

dman’s picture

dman commented

If you use repeat-x correctly, then it will not repeat-y, yet you say it is doing that. Could be you've got the syntax wrong.
Another first-google-page link has an example (scroll down to "css gradient background")
http://www.tizag.com/cssT/background.php

That gives you a gradient that goes across but not down any further than it should. You say the gradient 'restarted' which is the default behaviour unless you use background-repeat.

If you use background-repeat:repeat-x, then anything below the height of the image will be the background color of the element. If the color there is not what you want, then it's a different problem from the one you described.
If you want the non-gradient background to be white, just use background-color to set that too.

oadaeh’s picture

oadaeh commented
Assigned: doubleeater » Unassigned
Issue summary: View changes
Status: Active » Closed (won't fix)

This issue is being closed because it is against a branch for a version of Drupal that is no longer supported.
If you feel that this issue is still valid, feel free to re-open and update it (and any possible patch) to work with the 7.x-4.x branch.
Thank you.