0 
background: -moz-linear-gradient(45deg,  rgba(92,92,92,0.95) 0%,rgba(92,92,92,0.65) 45%,rgba(0,0,0,0.25) 45%,rgba(0,0,0,0.25) 47%,rgba(0,0,0,0) 47%);
background: -webkit-linear-gradient(45deg,  rgba(92,92,92,0.95) 0%,rgba(92,92,92,0.65) 45%,rgba(0,0,0,0.25) 45%,rgba(0,0,0,0.25) 47%,rgba(0,0,0,0) 47%);

これら 2 つの行は同一ですが、異なる結果が生成されます。制作中のものはこちら ( http://www.eprize.com/what-we-do/#mobile ) で確認できます。Chrome では 2 つの 45 度のグレーの縦縞が表示されますが、Firefox では 1 つが 2 つ目の縦縞ではなく画像全体ににじみます。

私はこれにグーグルで時間を費やしましたが、CSS3ジェネレーターの結果しか見つかりませんでした。これは私が望んでいるものではありません。これが Safari と Chrome でどのように見えるかについて、Firefox を取得するための助けはありますか?

4

1 に答える 1

0

この問題は、すべてのカラー ストップの始点と終点に対する Firefox の主張にありました。最後の 5 番目のカラー ストップは、残りのグラデーションを透明にするはずでしたが、そうではありませんでした。これが修正です。

background: -moz-linear-gradient(45deg, rgba(92, 92, 92, 0.95) 0%, rgba(92, 92, 92, 0.65) 45%, rgba(0, 0, 0, 0.25) 45%, rgba(0, 0, 0, 0.25) 47%, rgba(0, 0, 0, 0) 47%), rgba(0, 0, 0, 0) 100%);
于 2012-04-24T12:31:33.237 に答える