Color: rgba() workaround for Internet Explorer?

Question

I've been able to successfully use the following workaround method:

background: rgb(42,42,42);
background: rgba(42,42,42,0.7);

However, this only works with background:, and doesn't work with color:. Does anyone know a workaround to get it to work with color: ?

Answer 1

Internet Explorer only accepts percentages as RGB values. This will work

color: rgb(16%,16%,16%);
color: rgba(42,42,42,0.7);

Microsoft Spec: http://msdn.microsoft.com/library/ms530749.aspx

DEMO: http://wecodesign.com/demos/stackoverflow-7082955.htm

UPDATE because of a bug in IE compatibility mode, if you declare two of the same thing, it ignores them both, the following will work in both compatibility mode and standards mode

h1 {
    color: rgb(16%,16%,16%);
}
h1 {
    color: rgba(42,42,42,0.7);
}

Answer 2

After some additional research I found that this did the trick:

<!--[if lte IE 8]> 
    <style type="text/css"> 
        a#scrollUp { 
            color: #ffffff !important; 
        }    
    </style> 
<![endif]-->

It uses conditional stylesheets; lte IE 8 will match any IE version lower than or equal to 8. Just enter the proper (hex notation) color and prioritize it using important will work.

I hope this helps some other webdesigners as well!

I'm not sure about accepting my own answer, I just hope someone will still post a better (more efficient), working workaround.