Opacity Technique Question

[silverchild]

I'm not sure how to do something in Firefox, or if it even can be done.

What I want is to have a box with a background color, with the opcaity set to 40 or .4. Then, I want to have another div sit on top of that div and display text at 100% or 1 opacity.
The idea is to darken the background image enough so that the text is readable.

I've tried divs, divs within divs, putting the text on the first line or the second line. Nothing seems to work.

I can get it to work in IE but not FF. Can this be done?

[silverchild]

I guess you have to set the position of the element with full opcaity using position-relative. Interesting.

I used :
http://www.mandarindesign.com/troops...backgroundhard

[Apostropartheid]

In theory you could use rgba() color co-ordinates, but it's only supported in Firefox 3; not sure about Opera and WebKit. If you're not supporting IE6, PNG alpha would be a good idea.

[eak]

Firefox 3 and Safari 3 supports rgba (see css3.info)
For everyone else, I would use a png (with hack for ie6).