CSS Blur in IE 11

Question

I have been trying to get A css blur effect in IE 11 for hours and did not make any progress. I tried to use the following simple html: ```

``` I also tried just using the filter without the ms prefix. I saw that filter code on http://jsbin.com/ulufot/31/edit and even consulted the microsoft example http://samples.msdn.microsoft.com/workshop/samples/author/filter/blur.htm which does not work in my IE 11 on Win7. Do you have any ideas, what I could be doint wrong? probably interesting if you are struggling too: http://ie.microsoft.com/testdrive/Graphics/hands-on-css3/hands-on_svg-filter-effects.htm

Accepted Answer

According to this blog (http://demosthenes.info/blog/534/Cross-browser-Image-Blur-with-CSS) the blur filter was dropped after IE9:

```
filter:progid:DXImageTransform.Microsoft.Blur(PixelRadius='3');
```

They did give a solution called StackBlur (using JavaScript and Canvases):

http://quasimondo.com/StackBlurForCanvas/StackBlurDemo.html

It is in the form of a javascript add-on downloadable from that site.

CSS Blur in IE 11

Solution

Problem