background-image: -ms-linear-gradient(right, #0c93C0, #FFF);
background-image: -o-linear-gradient(right, #0c93C0, #FFF);
All experimental CSS properties are getting a prefix:
-webkit-for Webkit browsers (chrome, Safari)-moz-for FireFox-o-for Opera-ms-for Internet Explorer- no prefix for an implementation which is in full accordance with the specification.
Use top right instead of right, if you want a different angle. Use left or right if you want a horizontal gradient.
See also:
- MDN:
linear-gradient
Internet Explorer
For <IE10, you will have to use:
/*IE7-*/ filter: progid:DXImageTransform.Microsoft.Gradient(startColorStr="#0c93c0", endColorStr="#FFFFFF", GradientType=0);
/*IE8+*/ -ms-filter: "progid:DXImageTransform.Microsoft.Gradient(startColorStr="#0c93c0", endColorStr="#FFFFFF", GradientType=0)";
filter works for IE6, IE7 (and IE8), while IE8 recommends the -ms-filter (the value has to be quoted) instead of filter.
A more detailled documentation for Microsoft.Gradient can be found at: http://msdn.microsoft.com/en-us/library/ms532997(v=vs.85).aspx
-ms-filter syntax
Since you’re a fan of IE, I will explain the -ms-filter syntax:
-ms-filter: progid:DXImageTransform.Microsoft.Gradient(
startColorStr="#0c93c0", /*Start color*/
endColorStr="#FFFFFF", /*End color*/
GradientType=0 /*0=Vertical, 1=Horizontal gradient*/
);
Instead of using a RGB HEX color, you can also use a ARGB color format. A means alpha, FF means opaque, while 00 means transparent. The GradientType part is optional, the whole expression is case-insensitive.