IE11 won't display inline SVG background-image
<pre><code>span {
   background-image: url("data:image/svg+xml;utf8,&lt;svg version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' width='12px' height='8px' viewBox='0 -0.297 12 8' style='enable-background:new 0 -0.297 12 8;' xml:space='preserve'&gt;&lt;path d='M1.406,0L6,4.594L10.594,0L12,1.406l-6,6l-6-6L1.406,0z'/&gt;&lt;/svg&gt;");
   display:block;
   height:8px;
   width: 12px;
}
</code></pre>

<p><a href="https://jsfiddle.net/d9uu778k/" rel="nofollow">https://jsfiddle.net/d9uu778k/</a></p>

<p>Works fine in all other browsers except IE. I can view the SVG file on its own in IE11, it just refuses to display it inline. Bug?</p>