Alex Rivera | Logout

filter: blur(1px); doesn't work in Firefox, Internet Explorer, and Opera

Asked 2013-04-04T05:24:54.327
31

I have a problem with CSS. When I try to do

-webkit-filter: blur(1px);
-moz-filter: blur(1px);
-ms-filter: blur(1px);
-o-filter: blur(1px);
filter: blur(1px);

it looks perfect in Safari and Chrome, but the blur doesn't show up at all in Firefox, Opera, or Internet Explorer. Do those browsers support it? Or is there another method of getting the entire page to blur?

Edit
Report

1 Answer

3

That sounds about right, and it is currently supported in:

  • Chrome 18+
  • Chrome for Android 25+
  • Safari 6+
  • iOS Safari 6+
  • BlackBerry browser 10+

Reference

Here is an article from David Walsh (works at Mozilla) on Internet Explorer specific filters, for example t motion blur:

.blur { filter:blur(add = 0, direction = 300, strength = 10); }

It looks like normal blurring support is patchy with Internet Explorer though and I'm not surprised, especially pre-9.

answered 2013-04-04T05:28:07.343

Your Answer