blur (css) not working for background image

Fixed Issue #9697787


Andrei V.
Nov 7, 2016
This issue is public.
Found in
  • Microsoft Edge
Found in build #
Reported by 3 people

Sign in to watch or report this issue.

Steps to reproduce

[ using Microsoft Edge 38.14393.0.0 - Microsoft EdgeHTML 14.14393 ]

I’m trying to set a blur to a background-image and it is not working.

.card_login_bg {
width: 200px;
height: 208px;
top: 0;
margin: 0 0 0 -40px;
background-position: center center;
background-size: cover;
position: absolute;
z-index: -1;
opacity: .3;
-webkit-filter: blur(20px);
-moz-filter: blur(20px);
-o-filter: blur(20px);
-ms-filter: blur(20px);
filter: blur(20px);
overflow: hidden;


1 attachment

Comments and activity

  • Microsoft Edge Team

    Changed Status to “Confirmed”

    Changed Status from “Confirmed” to “Not reproducible”

  • Thank you for the report. I took a look and based on a bit simplified repro - can’t notice any difference between Edge, Chrome and Firefox on the development build of Edge, so even if we had a bug in this area - this doesn’t repro anymore.

  • It’s weird, because your test in my browsers are looking still wrong, look:

  • I’ve also found this - it’s caused by the z-index being below 0. For some reason this disables blurring. Doesn’t happen on any other browser.

    Bogdan - Your repo doesn’t have the z-index specified.

  • I am observing the same issue on Edge 38. Is there a workaround to this?

  • Very specific problem for EDGE, z-index on a element in a parent container breaks all css blur effect on background images in sibling elements.

    i think if 1 element has a z-index the others get a psuedo z-index and this breaks the blur!

    This looks like its due to the z-index being set. No other browsers exhibit this issue.

  • Hello,

    Thank you for providing this information about the issue. We will follow up with this new information in case 16846407.

    Best Wishes,
    The MS Edge Team

  • Microsoft Edge Team

    Changed Status from “Not reproducible” to “Fixed”

You need to sign in to your Microsoft account to add a comment.

Sign in