SVG高度不随纵横比调整

Question

使用了一个宽度为50px的div中的一个svg图像，但在IE11中，SVG高度为150px。它应该是50px X 50px。宽度50px是正确的，但高度没有生效。有任何建议吗？

.svg-cont{
  width:50px
}
img{
  max-width:100%;
  height:auto;
}

<div class="svg-cont">
  <img src="http://imgh.us/google-plus-hvr.svg" alt="" />
</div>

非常感谢您的帮助。 Codepen链接：http://codepen.io/shmdhussain/pen/YZmrOq

- Mohamed Hussain

---

SVG文件中的preserveAspectRatio属性怎么样？ - Alex - DJDB

@dejauneetdebleu：我在阅读了一些关于SVG的文章后解决了这个问题，其中来自Sara的 https://tympanus.net/codrops/2014/08/19/making-svgs-responsive-with-css/ 帮了我很多忙。将宽度设置为100%可以解决IE9-11中的问题。 - Mohamed Hussain

Answer 1

感谢！问题已经解决，只需将width:100%设置到图像标签即可。问题已解决。笔记代码链接：http://codepen.io/shmdhussain/pen/XMvzWv

.svg-cont{
  width:50px
}
img{
  max-width:100%;
  width:100%;
  height:auto;
}

<div class="svg-cont">
  <img src="http://imgh.us/google-plus-hvr.svg" alt="" />
</div>

参考资料：https://tympanus.net/codrops/2014/08/19/making-svgs-responsive-with-css/

- Mohamed Hussain