CSS background opacity with rgba not working in IE 8

css internet-explorer-8 rgba
Moon picture Moon · Oct 20, 2010 · Viewed 199.6k times · Source

I am using this CSS for background opacity of a <div>:

background: rgba(255, 255, 255, 0.3);

It’s working fine in Firefox, but not in IE 8. How do I make it work?

Answer

diablero13 picture diablero13 · Oct 20, 2010

to simulate RGBA and HSLA background in IE, you can use a gradient filter, with the same start and end color ( alpha channel is the first pair in the value of HEX ) 

background: rgba(255, 255, 255, 0.3); /* browsers */
filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#4cffffff', endColorstr='#4cffffff'); /* IE */

Related questions

IE8 gradient filter not working if a background color exists

I'm trying to use the following CSS styles. They are working on most browsers, including ie7. However in ie8, the transparent background does not show and instead I get the background color which I would like to leave set as …

Read More
Why an inline "background-image" style doesn't work in Chrome 10 and Internet Explorer 8?

Why the following example shows the image in Firefox 4, but not in Chrome 10 and Internet Explorer 8? HTML: <div style="background-image: url('http://www.mypicx.com/uploadimg/1312875436_05012011_2.png')"></div> CSS: div { width: 60px; height: 60px; border: 1px …

Read More
Opacity of div's background without affecting contained element in IE 8?

I want to set Opacity of div's background without affecting contained element in IE 8. have a any solution and don't answer to set 1 X 1 .png image and set opacity of that image because I am using dynamic opacity and color …

Read More