36

What's the difference between between IE's filter and -ms-filter properties? If I use one should I use them both? Do they do the same thing, but each work on only certain versions of IE?

Volker E.
  • 5,911
  • 11
  • 47
  • 64
Web_Designer
  • 72,308
  • 93
  • 206
  • 262

3 Answers3

54

Microsoft introduced -ms-filter to make Internet Explorer more standards-compliant (CSS 2.1 requires vendor extensions to have vendor prefix). As the syntax of original filter property is not CSS 2.1 compliant, IE8+ requires the value of the -ms-filter property to be enclosed in quotation marks.

filter: alpha(opacity=40);
-ms-filter: "alpha(opacity=40)";

-ms-filter is supported in IE8+, legacy filter property is, as far as I know, for backwards compatibility supported in all versions of Internet Explorer.

Related link: http://blogs.msdn.com/b/ie/archive/2008/09/08/microsoft-css-vendor-extensions.aspx

Please note that support for filters may be removed in IE10.

duri
  • 14,991
  • 3
  • 44
  • 49
1

-ms-filter property

Sets or retrieves the filter or collection of filters that are applied to the object. Note As of Windows Internet Explorer 9 this feature was deprecated. As of Internet Explorer 10 this feature was removed and should no longer be used.

-ms-filter property

Community
  • 1
  • 1
sonus21
  • 5,178
  • 2
  • 23
  • 48
-1

I believe -ms is the vendor prefix for some of the new CSS3 properties while filter is an older property meant for IE 6-8(I could be wrong on IE 6, but I know for sure it's used in IE 8). Here's more information on where -ms is used: http://msdn.microsoft.com/en-us/library/ms531207(VS.85).aspx.

ayyp
  • 6,590
  • 4
  • 33
  • 47
  • If I remember correctly, all of them will support `filter`, but it might only be IE 9 that supports `-ms-filter`. – ayyp Aug 01 '11 at 15:46
  • No. There is no such CSS3 property called filter. – Rob Aug 01 '11 at 16:20
  • All modern browsers ignore the filter property as it is non-standard and not a CSS3 property. Run it through the validator and it will be flagged as an error. – Rob Aug 01 '11 at 16:26
  • @Rob You're correct, I accidentally had `-ms-filter`, thank you for correcting my oversight! `filter` may not validate, but it is certainly useful for trying to make things cross-browser compatible. – ayyp Aug 01 '11 at 16:28
  • 1
    Well, again, you should use ms-filter. It's the same thing but will validate. – Rob Aug 01 '11 at 16:30
  • 5
    @Rob It won't validate, just like any other vendor extension. Also, `-ms-filter` is not supported in IE7 and lower. – duri Aug 01 '11 at 16:34
  • @duri - Vendor extensions are valid CSS. The validator has extensions enabled but extensions still show as errors. I thought that had been fixed. – Rob Aug 01 '11 at 17:09
  • well, as long as it matters, it validates at current moment. Only problem is to make some nasty stylesheets ... for example, in Wordpress ... to have two stylesheets ... and to include somehow condidtional comments hamdled stylesheets. – HX_unbanned Mar 30 '13 at 13:41