Фильтр размытия CSS не работает с определенными псевдоэлементами в MS Edge

Я использую фильтр размытия на фоновом изображении псевдо-элемента. Если Z-индекс псевдо-элемента равен -1, размытие не влияет на Microsoft Edge. Он работает без Z-индекса. (Вы должны вручную включить фильтры CSS через about:flags в Edge).

вот пример:http://codepen.io/anon/pen/WrZJZY?editors=110

это связано с экспериментальной поддержкой (в Edge) или я делаю что-то неправильно здесь ? Он работает в других браузерах (Chrome, Safari, Firefox).

.blur {
  position:relative;
  border: 4px solid #f00;
  height:400px; 
  width:400px;
}

.blur:before {
  content: "";
  position: absolute;
  width:400px;
  height:400px;
  z-index:-1;
  background-image:url('https://i-msdn.sec.s-msft.com/dynimg/IC793324.png');

  filter: blur(5px); 
  -webkit-filter: blur(5px);
  -moz-filter: blur(5px); 
  -o-filter: blur(5px); 
  -ms-filter: blur(5px); 
  filter:progid:DXImageTransform.Microsoft.Blur(PixelRadius='5'); 
}