在Internet Explorer 10-11中缩放.svg

Question

在Internet Explorer 10-11中缩放svg时遇到问题。它适用于其他浏览器。 HTML：

<ul> 
    <li><a href="#">English <img src="https://lipis.github.io/flag-icon-css/flags/4x3/gb.svg" alt=""></a></li> 
</ul> 

CSS：

li img { 
    width: 19px; 
    height: 13px; 
} 

我怎么能缩放图像，使其适合在IE10 + 11所需的宽度是多少？

See this fiddle。

Answer 1

您可以将图像放入容器中，并在此容器上指定宽度和高度。

HTML

<ul> 
    <li> 
     <a href="#"> 
     English 
     <div class="img-container"> 
      <img src="https://lipis.github.io/flag-icon-css/flags/4x3/gb.svg" alt=""> 
     </div> 
     </a> 
    </li> 
</ul> 

CSS

li .img-container { 
    width: 19px; 
    height: 14px; 
} 

li img { 
    max-width: 100%; 
    max-height: 100%; 
    display: block; 
    outline: none; 
    border: none; 
} 

https://jsfiddle.net/6e47sxhg/5/