CSS: IE: Version of style "background-color:rgba(...)"

Question

I have a requirement to have a div with a background image, and overtop that image should be a 0.7-opacity black layer.

For this, I'm using:

background-color:rgba(0, 0, 0, 0.7);
background-image:url(/Images/hash-000000-pattern.gif);

This works perfectly in everything but IE. In IE 6, 7, and 8, the background-color:rgba(0, 0, 0, 0.7); isn't rendered.

Is there anything I can do in CSS without changing the markup to create a dimmed-opacity black layer over the background image? Some "filter" style?

Answer 1

No. The only options you have are ms-filters or a slightly different one.

<!--[if IE]>

   <style type="text/css">

   .color-block {
       background:transparent;
       filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000050,endColorstr=#99000050);
       zoom: 1;
    } 

    </style>

<![endif]-->

see this one too: http://www.hedgerwow.com/360/dhtml/rgba/demo.html