CODEWITHSUNDEEP
internet-explorercss
FlyingCat
FlyingCat

Reputation: 14250

Opacity issue in IE

I am trying to create opacity background color for IE in css

The css filter will change the elements to have opacity of 80 and I only want background-color to be transparent.

.element{

//for Chrome and FF
'background-color': rgba(0, 0, 0, 0.8)

//for IE..but it will make entire element having 80 opacity instead of the background-color only....   
filter:alpha(opacity=80)


}

Thanks for the help.

Upvotes: 0

Views: 105

Answers (2)

Spudley
Spudley

Reputation: 168665

I recommend using an IE script called CSS3Pie.

This is a script that implements some of the CSS3 properties into older versions of IE, including backgrounds with alpha channel colours. This means you can write (almost) standard CSS code for IE just like all the other browsers.

With the PIE.htc file in your site, your CSS code would look like this:

.element{
    //for Chrome and FF
    background: rgba(0, 0, 0, 0.8);
    //for IE...
    -pie-background: rgba(0, 0, 0, 0.8);
    behavior: url(PIE.htc);
}

See the CSS3Pie documentation for more info.

Hope that helps.

Upvotes: 2

biziclop
biziclop

Reputation: 14596

Try using the gradient filter, which accepts AARRGGBB formatted colors:

  -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#80112244,endColorstr=#80112244)";
      filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr=#80112244,endColorstr=#80112244);

http://msdn.microsoft.com/en-us/library/ms532997(v=vs.85).aspx

Upvotes: 1

Related Questions