I have recently changed the design of a site to incorporate a transparent background in div containers using the new CSS3 styles. The only problem is that any images I have within these div containers also become transparent.

The page in question is a div container with a table inside. The image (a jpeg with solid white background) is placed inside the table with a div of it's own for styling. I have tried setting opacity for the image div as well as background colours and images, none of which work. I have also tried to give the table cell a background colour.

Any ideas would be brilliant!

Thanks,
Dan

how about a feckin url?! oops sorry - wrote what i was thinking there - but seriously a url would help lot

No need to be like that

http://www.beehappy.me.uk/bags/darli...ag/prod_3.html

Also, the homepage has an image slider which has the same problem in Firefox, but in IE the image is solid, http://www.beehappy.me.uk/index.php

Thanks

have you tried just setting the background colour to white without using rgba?

The only problem is that any images I have within these div containers also become transparent.

That's because the transparency is INHERITED and there's not much you can do about it.

are you sure? i was just reading this and it states
"RGBa on the other hand sets colour transparency only for the element that I am declaring values for and the transparency is not inherited by child elements." http://forabeautifulweb.com/blog/abo...ready_to_rock/ so i'm a bit confused

Tried that as well and still no joy. I have decided to use a transparent PNG for the container background instead and this has solved the problem. Not what I wanted to do, but it works so I can;t complain!

Thanks for all the advice,
Dan

Yes.. well.. CSS3 is NOT fully supported by all browsers either so, only some things will work