Making a Block Display Transparent with CSS or HTML

Hello everyone,

I would like to put a white 50% opaque block with black text laying on top of it. I have the block and the text all laid out, but I don’t know how to do transparency in CSS or HTML.

This one should be easy. :eye:

I have answered this question for myself. :cool:

Which solution did you use? They each have their pros and cons : )

(notably, that using the CSS opacity settings will also hit the text, and that using the adjacent sibling trick means a brittle-height box (even if you use em’s), and the rgba() trick fails in IE (but you can fallback to a solid colour), and the semi-trans PNG has IE6 issues plus way larger-than-necessary filesize, and lastly a fake-semi-trans 8-bit tiled image works everywhere but only if the background behind it isn’t a pattern)