I only want the background color of white in my div to be translucent roughly 50%. The content should be fully opaque. What's the proper way to do this? I imagined when I looked up the background CSS property, I'd find an opacity setting, but didn't. Don't care about IE6.
UPDATE: solving with the rgba solution given below in conjunction with CSS3PIE's solution for getting rgba to work in IE browsers.
You can use the background-color: rgba()
notation:
#theIdofYourElement,
.classOfElements {
background-color: #fff;
background-color: rgba(255,255,255,0.5);
}
background-color
(for browsers that don't understand the rgba()
notation). Albeit I was under the impression that all but IE do understand it (but I could be wrong, and haven't tested to be sure...).
Edit with thanks to @akamike.
which browsers don't understand rgba? will they all in the future, is this part of css3?
The best information I could find is the CSS Tricks' rgba()
browser support table, with a link to a demo and 'more complete' compatibility table.