PDA

View Full Version : Help with Alternating Color backgrounds


Phooey
11-13-2006, 10:19 PM
I'm trying to get a small image (no larger than maybe 10x10 pixels) to repeat horizontally at both the top and bottom of my alternating color css styles. Ideally, it will be a different image on the top than at the bottom. I can get it to do either one or the other, but not both. Any tips how?

Thanks,
Phooey

CyberAlien
11-15-2006, 03:09 PM
You can't have more than one background image for css class.

The only solution is to put nested <div> in table cells like this: <td class="alt1"><div class="altdiv">contents of table cell</div></td> and put different background images for it. Because div might not have full height of table cell I suggest to put top image background for altdiv and bottom image background for alt1/alt2/alt3.

In extra css add code like this:.alt1 .altdiv, .alt1Active .altdiv {
background-image: url(whatever.gif);
background-repeat: repeat-x;
background-position: top left;
}
.alt2 .altdiv, alt2Active .altdiv {
... same as above, but for alt2
}
.alt3 .altdiv {
... same as above, but for alt3
}