Click to See Complete Forum and Search --> : [RESOLVED] Image and color in table cell

01-02-2007, 02:29 PM
First of all, something more about the title, so you don't think "that's such a n00b question" ...
I know how to make a cell have a background image and a color which is only shown when the image isn't loaded, but that's not what I want.

I'm constructing a website for someone and he wants to have the cells have a background gradient (333333 -> 999999) and I've made a .png for that, but I've also got some bigger cells (in lenght) than the picture, so I get a grey zone underneath.
I've searched the internet for some code to have a background image on the top of a cell and a color which also continues underneath the picture when more text is added. And I found some and used it, but the one I'm working for didn't like it so I deleted everything.

Now, after a week, he decides to use the code after all :rolleyes: ... But I don't have it anymore.
I've just been searching for over 3 hours but I haven't found it anywhere.

Does anyone know who this can be done? I remember that everything was done within the <td> tags, so without any CSS.

Or if anyone knows another way to do this, let me know!


01-03-2007, 04:07 AM
Ok, maybe it's just something you can't think of that fast ... The solution seemed very simple though, even for me! :p

Maybe I can provide the cell with a fixed background and hight and add a scrollbar to that cell?

Can someone help with coding that?

01-03-2007, 06:02 AM
cant you just do it with css? set the background-color and the background-image? and for the scrollbar thing, you just need to set the height and width with css, then set the overflow property to auto

01-03-2007, 09:30 AM
I don't know about doing it without CSS but with CSS it's easy, if I'm understanding what you're asking.

Here's an example, View here (http://rigent.com/junk/tableimageexample.htm). The image I used is this one (http://rigent.com/junk/bgfade.png).

This is the only important bit of the CSS:

td {
background: #999 url(bgfade.png) repeat-x left top;

This just says make the bg #999 (shorthand for #999999), make the background image bgfade.png, repeat this image horizontally only and align it to the left and top.

The background image is 100pixels high, any table cell longer than that is displaying the background colour I set.

01-03-2007, 12:07 PM
That exactly what I need :)
Thanks a lot!