CSS opacity - do not affect child elements

Question

Possible Duplicate:
how to not apply opacity for child element?

Is it possible with css or jquery to apply transparency/opacity to an element and not have that affect child elements?

No it's not! You could use RGBA background colors to get a somewhat similar result. — adeneo, Nov 05 '12 at 16:29
I believe it is not possible. Opacity includes all children of the element. What effect would you like to achieve? Maybe there is a workaround. — Marko Francekovic, Nov 05 '12 at 16:30
You would need to specifically set the CSS of the child elements as well. — bvulaj, Nov 05 '12 at 16:30

score 2 · Accepted Answer · answered Nov 05 '12 at 16:32

2

Maybe you will want to set the background opacity

/* Fallback for web browsers that doesn't support RGBa */
background: rgb(0, 0, 0);
/* RGBa with 0.6 opacity */
background: rgba(0, 0, 0, 0.6);

Check out this blog for further support

answered Nov 05 '12 at 16:32

score 1 · Answer 2 · answered Nov 05 '12 at 16:33

1

No, transparency is inherited, but you can use RGBA (alpha channel) instead.

answered Nov 05 '12 at 16:33

2 Answers2