countering a div opacity?

Question

If I have a div that acts like a box, and I make it real sexy with 10% opacity. How do I counter it since everything in the div also gets the opacity. Lets say i have a box(div) with a 1px border and text, putting opacity on it will make it look bad and i only want opacity on the background.

Answer 1

This is how you can apply opacity on background colors only, and not to the whole element and his children:

background: rgba(0,0,0, 0.5) //gives you a black background with 50% opacity

you can test it out here: http://jsfiddle.net/ypaTH/

there was a similar question here: How to give cross browser transparency to element's background only? (with IE version)