svg background image position is always centered in internet explorer, despite background-position: left center;

The problem is not with your CSS but with your SVG. The SVG will grow to fill the entire element box’s background (as expected). How your SVG scale then becomes the controlling factor:

Set a viewBox="0 0 width height" (in pixels) attribute on your <svg> element and remove its width and height attributes. You also need to set preserveAspectRatio="xMinYMid" (x/vertically left-aligned, y/horizontally middle-aligned) on the svg element. This works with Internet Explorer 10 and 11, at least.

<svg viewbox="0 0 64 64"
    preserveAspectRatio="xMinYMid">
    … </svg>

Learn more about the preserveAspectRatio and viewBox attributes. Source, “Getting started with SVG” in the IEblog.

In my case adding "width" & "height"-values solved the problems on ie9-11.

The accepted answer works, but here's another solution.

Including the dimensions in the SVG so they are identical to the viewbox dimensions also does the trick.

width="496px" height="146px" viewBox="0 0 496 146" 

If you're like me and you edit/save your SVG's in Illustrator, untick the "responsive" checkbox in Advanced Options in the save dialog. Then the dimensions will be included.

(Since it's scalable, it's 'responsive' by definition. So this setting seems a bit redundant.)