CSS SVG clip-path urlがfirefoxで動作しない

Question

私はに続き、私のプロジェクトにコードを入れました。すべてが良いですが、Firefoxではすべてが間違っていてクリップが機能しません。

<svg class="clip-svg"> 
    <defs> 
    <clipPath id="test-clip" clipPathUnits="objectBoundingBox"> 
     <polygon points="0 0, 0.73 0, 1 0.59, 0.48 1, 0 075" /> 
    </clipPath> 
    </defs> 
</svg> 
<figure class="clip-block"> 
    <div class="clip-each clip-solid my-clip-path"> 
    <div class="clip-entry"> 
     <figcaption> 
     Test Clip 
     </figcaption> 
     </div> 
    </div> 
</figure> 

html, body, .clip-block { 
    width: 100%; 
    height: 100%; 
    overflow: hidden; 
} 
.clip-svg { 
    width: 0; 
    height: 0; 
} 
.clip-each { 
    display: block; 
    position: absolute; 
    margin: 0 auto; 
    -webkit-transition: all 2s ease-in-out; 
    transition: all 2s ease-in-out; 
} 
.clip-solid { 
    width: 300px; 
    height: 300px; 
    background-repeat: no-repeat; 
    background-size: 100% 100%; 
    background-color: #FF4081; 
    cursor: pointer; 
    overflow: hidden; 
} 
.my-clip-path { 
    width: 38.5%; 
    height: 74.5%; 
    background-image: url('http://placehold.it/500x500'); 
    background-color: #31686e; 
    -webkit-clip-path: polygon(80.9% 9.1%, 100% 0, 100% 100%, 0 100%); 
    clip-path: polygon(80.9% 9.1%, 100% 0, 100% 100%, 0 100%); 
    -webkit-clip-path: url("#test-clip"); 
    -moz-clip-path: url("#test-clip"); 
    -ms-clip-path: url("#test-clip"); 
    clip-path: url("#test-clip"); 
} 

非常に奇妙です！私はコードをjsfiddleに入れてFirefoxで正しく動作しますが、同じコードで自分のhtmlを作成すると、Firefoxはすべてを破り、clip-pathを無視します。

このプロジェクトはすばやく完了する必要があります。

Answer 1

私はそれを解決しました！

新しいCSS：

.my-clip-path { 
    width: 38.5%; 
    height: 74.5%; 
    background-image: url('http://placehold.it/500x500'); 
    background-color: #31686e; 
    -webkit-clip-path: polygon(80.9% 9.1%, 100% 0, 100% 100%, 0 100%); 
    clip-path: polygon(80.9% 9.1%, 100% 0, 100% 100%, 0 100%); 
    -webkit-clip-path: url("index.html#test-clip"); 
    -moz-clip-path: url("index.html#test-clip"); 
    -ms-clip-path: url("index.html#test-clip"); 
    clip-path: url("index.html#test-clip"); 
}