変換回転後の奇妙な動作とFirefoxの境界色

Question

正方形から三角形を作り、回転させて影を正しく使うことができました。

しかし残念ながら私はFirefox 48.0.2で私の三角形の中で奇妙な空間に直面していました。

ChromeとIEでは完全に機能します。

多分誰かがそれに満腹感を持っていますか？ なぜそれが起こったのですか？ これを修正する方法を知っている人はいますか？

ありがとうございました。

.item:after{ 
position: absolute; 
content: ""; 
border: 39px solid black; 
border-color: transparent transparent black black; 
box-shadow: -3px 3px 3px 0 rgba(0, 0, 0, 0.2); 
transform: rotate(-135deg); 
left:100px; 
top:100px; 
} 

例があります： https://jsfiddle.net/uqoh3o9s/11/

Answer 1

あなたはそれを回転させる必要があるのはなぜ？ここで

.item:after { 
    content: ""; 
    position: absolute; 
    width: 0; 
    height: 0; 
    border-style: solid; 
    border-width: 50px 0 50px 86.6px; 
    border-color: transparent transparent transparent #000000; 
    filter:drop-shadow(0 2px 4px rgba(0,0,0,.5)); 
    left:100px; 
    top:100px; 
} 

フィドル https://jsfiddle.net/ffnw22ou/1/