Color Ie Fallback For Rgba() Does Not Work
Why the following fallback for IE color: red; does not work ? In IE7, the color is black rather than red. Live demo here HTML:
Hello
Solution 1:
RGBA is not supported in IE.
However, as it sees your color: style, it attempts to evaluate it and reverts to the default color (#00000000). You could use an IE specific hack here, such as
*color: red;
But, assuming that you are trying to affect only the background color, and not the opacity of the entire element, you're best off with a filter that sets the desired rgba value as the start and end color of a gradient - creating an rgba background.
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000050,endColorstr=#99000050);
-ms-filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000050,endColorstr=#99000050);
But remember - IE assumes that the Alpha is first, not last, so don't just convert and copy your values. The double filter is for IE6 and IE7 respectively.
Solution 2:
Splitting those two color declarations into separate CSS rulesets cures this problem:
span {
font-size: 2em;
color: red;
}
span {
color: rgba(250, 250, 97, 0.9);
}
Now IE gets red text, better browsers get the RGBA declaration.
Post a Comment for "Color Ie Fallback For Rgba() Does Not Work"