Why doesn't this SVG graphic scale in IE9 and 10 (preview)?

Question

According to IE website SVG is supported. And according to this answer too What are SVG (Scalable Vector Graphics) supported browsers?

http://jsfiddle.net/jitendravyas/2

Answer 1

The problem is that you are using percentages for height and width, as explained here (http://www.seowarp.com/blog/2011/06/svg-scaling-problems-in-ie9-and-other-browsers/).

If the width and height are either defined as something as useless as 100% or if they aren’t defined at all, these browsers will make a guess as to what the dimensions ought to be based on the points and shapes defined in the body of the SVG file.

Change to width=480 and height=360 and you should be fine.