壞IE11 SVG渲染 - 背景圖像

我有一個SVG圖像作爲背景，與background-size:contain。在除IE以外的所有瀏覽器中，它看起來很完美。但是，在IE中，徽標的底部略微切掉，邊緣模糊。
我試過this（從SVG文件中刪除設置的寬度和高度）和this（在下面添加一個邊距），它仍然被切斷，並且找不到關於模糊邊緣的任何內容。壞IE11 SVG渲染 - 背景圖像

IE11渲染：
IE11 Rendering

的Chrome/Firefox顯示：
Chrome Rendering Firefox Rendering

這裏是我的，我怎麼顯示該圖像CSS：

.header-container::before { 
    content: ""; 
    display: block; 
    width: 15em; 
    padding: 0.825em 0; 
    background-image: url('reed-logo-white.svg?1427895453'); 
    background-position: 0 0; 
    background-repeat: no-repeat; 
    background-color: transparent; 
    background-size: contain; 
    margin: 1em auto; 
}

有誰知道如何解決這個問題，或者至少告訴我爲什麼會發生這種情況？在此先感謝！

來源

2015-04-01 iain

您可以將剩餘的代碼發佈到JSFiddle嗎？ – 2015-04-01 14:33:05

@ShaunLoftin，「你的其他代碼」是什麼意思？你還想看什麼？ – iain 2015-04-01 21:25:51

這裏的任何解決方案？我有同樣的問題。關於svg渲染，IE11看起來很糟糕。 – xforfun 2015-08-07 08:41:11

我也對這個問題感到沮喪。我發現的唯一解決方案是重新保存我的SVG文件，以便： 1）畫板尺寸是像素整數（無分數），並且如果不起作用，請將2px添加到畫板尺寸（寬度或高度），在藝術品周圍添加更多空白區域

來源

2015-11-28 09:42:19 user1704915

壞IE11 SVG渲染 - 背景圖像

回答

相關問題