svg背景图片的位置始终在Internet Explorer中居中，尽管背景位置为：左居中；

我正在使用SVG徽标作为背景图片，但似乎无法使其在Internet Explorer （编辑：和Safari）中正确对齐到左侧。

容器看起来像这样：

<div id="header">
    <div id="logo"></div>
</div>

搭配款式：

#header{
    width: 100%;
    max-width: 1200px; 
    height: 100%;}

#logo{
    background: url(../images/ss_logo.svg);
    background-position: left center;
    width: 100%;
    height: 100%;
    float: left;}

您可以看到<div>应当覆盖其父项的100％，但在元素左侧显示徽标。在Chrome和Safari中这可以正常工作，但徽标始终<div id="logo">位于IE中的居中位置。

似乎很难找到信息，还有其他人遇到过同样的问题吗？

这是问题的示例版本的链接，绿色框是SVG。