Css colouring - from dark to light !!

[badboyspy]

Hello everyone! I'm new to this forum; hope you lot can give me a hand!

I'm having problem in (well, I tried to) colouring a row of a table by doing dark red on the left hand side and then it gradually fades into light red.

I don't want it to change colour from time to time or change colour due to some event, I just want a box with dark red on the left-most and as the colour goes right, it gets lighter and lighter!


So it should look like this:


Very very dark -> very dark -> dark -> light -> very light -> very very light -> white


Am I making any sense???

Many many thanks !!!!!!!!

[WebJoel]

What you want in a gradient shim. A graphic that only a pixel or two tall, and several hundred or maybe a thousand or thousand and one-half wide...
Then, you make that be the background-image, and it 'tiles' vertically, top-to-bottom (or horizontally, left-to-right). Clean, small, covers a wide range of uses and container sizes. That is to say, if the image is 1500px wide by 1px tall, you could use this as a body background, and it will work perfectly for all resolutions 'under' 1500px wide. Any wider though, they will get a flash of the 'left-hand' end of the graphic repeating again along the x-axis (horizontal is "x" axis, vertical is "y" axis)...

Repeat for smaller DIV and expected widths, etc.

Attached, a quick example. Images are just 8-pixels tall, but repeated vertically! A red-to-white background for the page, a blue-to-white background for the smaller DIV. Download these three files (index.html, and the two image files), and it works.
I built this in about 5-minutes. Very simple. :)

[badboyspy]

Thanks you very much for helping me.

But, there's a small problem, how do you effectively create such gradient shim? In what software? Where to find it online?

Thanks alot again !!

[WebJoel]

I use "PaintPro". They have a "gradient" palatte that you chose the two colors, and using a 'blank' image, you 'bucket-fill' the image.
I had (deleted it, -no longer needed it) a FREEWARE paint product that one could use SEVEREAL COLORS and produce a 3, 4 or 15-color 'shim' that when tiled, 'repeated' the effect and made like 'tiger stripes' either down, or across, your background!!

Try www.majorgeeks.com or www.tucows.com and 'search' for "graphics" software...

There are probably a few freeware paint products out there that you can use. PaintPro cost me something like $99.oo a few years ago. That was barely within my budget at the time I was going to college and that was expensive.
Photoshop CS is something like (depending upon what you get) wither $400.oo or $900.oo I think(??) I know that that the college bookstore had a 'student's version' that, upon proof that you were attending classes there, would cost only $400.oo but (here's the caveat), it was non-upgradeable. -You could never get an online-upgrade to newer includes. :eek:

One could impose upon friends to make images for you on-demand. Heck, -here is a great place to ask for freebie image background gradients. I'd do it. Just state the colors, direction (left-right or top-down), and desired width (to fit completely a screen-width of 1024, or higher, or background for TABLE or DIV of x-width or x-height...). -I'm all about the freebies and open-source stuff. :D

[ray326]

The GIMP is a very good free paint program that can do that and much more but it has a pretty steep learning curve. Oh, I just found that Inkscape can do that very easily, too. It's a free drawing program that uses SVG as its native format but can export bitmaps.