MS Edgeの特定の擬似要素でCSSぼかしフィルタが機能しない

Question

擬似要素の背景画像にぼかしフィルタを使用しています。擬似要素のZ-インデックスが-1の場合、ぼかしはMicrosoft Edgeでは効果がありません。 z-indexなしで動作します。 （Edgeではabout:flagsでCSSフィルタを手動で有効にする必要があります）。ここで

は例です：http://codepen.io/anon/pen/WrZJZY?editors=110

が原因（エッジで）実験的にサポートしたり、私がここで何か間違ったことをやっているこのですか？他のブラウザ（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'); 
} 

Answer 1

これは実装上の制限であるようです。私は今問題を提出しており、適切なチームができるだけ早くレプロを評価するようにします。今のところ、最良の選択肢は、コンテンツの下に画像を配置することを避け（z-インデックスが負の場合）、コンテンツを画像の上に配置します（より高いz-インデックスで）。

フィドル：提出https://jsfiddle.net/jonathansampson/610arg2L/

/* Above Fiddle contains sample CSS */ 

問題：あなたは、バグへのリンクをhttps://developer.microsoft.com/en-us/microsoft-edge/platform/issues/9318580/