Getting linear gradients to work on IE 8

Question

body {
    /* Mozilla Firefox */ 
    background-image: -moz-linear-gradient(bottom, #FFFFFF 0%, #5EB9FF 100%);
    /* IE10 */ 
    background-image: linear-gradient(bottom, #FFFFFF 0%, #5EB9FF 100%);
}

The above code works fine on Firefox and Internet Explorer 10, but neither of them work in IE 8.

Now could you please tell me how to make this code work in Internet Explorer 8?

score 4 · Accepted Answer · edited May 23 '17 at 12:27

4

filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#5EB9FF', endColorstr='#FFFFFF');

Note: The previous rule is a full rule. Do not use it in this way: ~~background: filter: ....;~~!

See also: CSS3 cross browser linear gradient

edited May 23 '17 at 12:27

Community

1
1

answered Feb 26 '12 at 18:04

Rob W

341,306
83
791
678

Thanks Rob W for your reply. I tried this- background-image:-ms-filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#5EB9FF', endColorstr='#FFFFFF'); but its not working. Normally I am suppose to see a combination of blue and white color in the background but in the IE 8 its showing kind of grey. thanks – black_belt Feb 26 '12 at 18:27
@black_belt Do **not** use `background: filter:...`. My answer contained the whole rule, and I have successfully tested it. Using `filter`: http://jsfiddle.net/3aFs7/1/ and using `-ms-filter`: http://jsfiddle.net/3aFs7/2/. – Rob W Feb 26 '12 at 19:02

Getting linear gradients to work on IE 8

1 Answers1