SVG sprite icon background position appears off in newer version of Chrome
Update: I added preserveAspectRatio="none"
as an attribute on the svg tag in the svg file, and that fixed it! More info here: http://www.yootheme.com/support/question/6801?order=modified
I had the same problem. I fixed it by setting the background-size
to exact values (not using auto
).I originally defined the size of my svg sprite like this:
.icon { background-image: url("sprite.svg"); background-size: 4em auto;}
I changed it to
.icon { background-image: url("sprite.svg"); background-size: 4em 99em;}