Gradient Colors in Internet Explorer

Gradient colors in Internet Explorer

Look at the custom CSS filters IE can handle
http://msdn.microsoft.com/en-us/library/ms532847.aspx

Gradients in Internet Explorer 9

You still need to use their proprietary filters as of IE9 beta 1.

CSS: How to set up gradient background cross browser (only missing IE8 and IE9)

filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0002b0fd', endColorstr='#028dca',GradientType=0 );

will give you IE6-9.

Using: http://www.colorzilla.com/gradient-editor/

IE8 gradient filter not working if a background color exists

After glancing over at CSS3please I realized I was doing overkill with my IE7/IE8 gradient styles. Simply using the following style does the job:

filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#444444', EndColorStr='#999999');

Apparently, there is no need for the -ms-filter and zoom rules.

CSS3 Gradient shows wrong colors in Internet Explorer

The quotes for the colour values in the filter property are being encoded as '. This causes the colour to rely on error handing and changes the original value.

Fixing the quotes will give the correct green gradient.

Radial gradient for Internet Explorer

You need to add the -ms-radial-gradient CSS declarations.

For example:

background: -ms-radial-gradient(50% 40%, circle cover, #fcfcfc, #efeff1 66%, #9b5050 100%);

Here's the working jsFiddle.

How to make background-image with linear-gradient work on IE 11?

linear-gradient() is supported unprefixed on IE10 RTM and later, including IE11. You never need the -ms- prefix — only the pre-release versions of IE10 required it and those versions don't even run anymore. You're just wasting space by including the prefix in your CSS.

Note that the directional syntax for linear-gradient() is different; what was originally top is now represented as to bottom instead (see this blog post, this question, and the spec for details):

background-image: url(IMAGE), linear-gradient(to bottom, #ffffff, #BEE38F);

---

Related Topics