坏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渲染 - 背景图像

回答

相关问题