title: SVG scaling in IE11
body: <p>I like to use inline SVG elements with a <code>viewBox</code> set and then setting the height in the style or with a class and leaving the browser to set the width itself according to scale:</p>
  
  <pre><code>&lt;svg style="height: 20px" viewBox="0 0 399 52" ...
  </code></pre>
  
  <p>This works in Chrome, Firefox, Safari:
  <a href="https://i.stack.imgur.com/HuGhK.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/HuGhK.jpg" alt="chrome etc"></a></p>
  
  <p>but IE11 does not seem to handle this correctly:</p>
  
  <p><a href="https://i.stack.imgur.com/QApzu.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/QApzu.jpg" alt="IE11"></a></p>
  
  <p>Here is the js-bin: <a href="http://jsbin.com/lovicitoco/edit?html,css,output" rel="nofollow noreferrer">http://jsbin.com/lovicitoco/edit?html,css,output</a></p>
  
  <p>Is this a know IE11 problem? Is there some nice workaround?</p>