圖標不是Chrome瀏覽器更新

過去的谷歌瀏覽器更新後後可見（52.0.2743.116 - > 53.0.2785.89/53.0.2785.101）在我的Web應用程序的圖標是不可見的了。圖標不是Chrome瀏覽器更新

我使用SVG spritesheet作爲背景圖像，並選擇在我的CSS背景位置所需要的圖標。

我發現，如果一個背景顏色給出，這是不是透明的圖標是可見的。對於具有透明背景的圖標，我使用值rgba（255,255,255,0.01）。

我的HTML：

<h3>background-image with background-position</h3> 

<span class="icon icon-1"></span> 
<span class="icon icon-2"></span> 
<span class="icon icon-3"></span> 

</body> 
</html>

我的CSS：

.icon { 
    display: inline-block; 
    background-image:url("%FilePATH%/icons_spritesheet.svg"); 
    background-size: 2350px 2340px; 
    width: 50px; 
    height: 50px; 
    border-radius: 2px 
} 

.icon-1 { 
    background-position: -285px -645px; 
} 

.icon-2 { 
    background-position: -715px -505px; 
} 

.icon-3 { 
    background-position: -285px -785px; 
}

這是爲什麼happpening？其他/更好的解決方案，歡迎。

來源

2016-09-13 1337

問題尋求幫助的代碼必須包括必要的重現它最短的代碼**在問題本身**最好在[**堆棧片段**]（https://blog.stackoverflow.com/2014/09/引入可運行的JavaScript-CSS-和HTML的代碼段/）。請參閱[**如何創建最小，完整和可驗證的示例**]（http://stackoverflow.com/help/mcve） –

解決方案（即工作對我來說）：

問題是我的SVG。我使用了其他文件，並沒有這個問題。

但是......這個問題發生在最新的Chrome版本或者其他人有同樣的問題。對於我的SVG，它可以去除邊界半徑。如果給出了邊界半徑，則圖標不再可見。

來源

2016-09-13 12:48:36 1337

圖標不是Chrome瀏覽器更新

回答

相關問題