Hello.
I’m building a site that has a svg logo in header and footer. In the header (which as position: fixed) I use an _div_ tag with the svg as background, and in the footer I use it as a _img_ tag. The background in the anchor is used in the original size, while the img tag is a little smaller for design purposes.
The issue is that sometimes explorer moves and crops the background in the header when another element with the same svg file as source is set at a different size. This problem is happening in ie10 but I think it happens in ie9 as well. I can solve the issue in ie9 targeting that specific browser and using a png file instead, but ie10 makes this a little harder because it no longer reads conditional comments.
I’ve made a fiddle in: http://jsfiddle.net/uK2La/
I’m very interested in knowing if this is a bug in ie (which I think it is, since other browsers seem to work fine) or if there is something I’m missing with svgs files in ie rather than a workaround.
(I have also made a pen at http://codepen.io/anon/pen/zviwF but most of the time the error doesn’t show until you resize the window).
