内联SVG在IE11 / 10上缩小

时间:2016-10-19 20:34:02

标签: html css svg

我有两个很棒的,响应迅速的SVG,我已经从Illustrator中导出了。 SVG标记包含一个viewBox,并没有指定高度/宽度 - 这些是通过CSS设置的。我正在使用SVG内联。

除了IE10 / IE11之外,一切看起来都很棒。我发现的每篇文章都说清楚了viewbox和height / width属性,SVG应该在IE上扩展。

我的SVG标签如下:

<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
 viewBox="0 0 880 452" style="enable-background:new 0 0 880 452;" xml:space="preserve">

CSS:

svg {
  width: 100%;
}

但是当我添加高度/宽度属性时,它确实可以在IE上运行(尽管所有文章我都在阅读)。但是现在,它不能在其他浏览器上工作,因为它会抛弃SVG的大小(即使在小屏幕上也能保持400px的高度)。

我无法找到有助于IE的任何css修复,甚至在SVG或其任何组件(甚至包括!important)上声明设置的高度/宽度都不会改变大小SVG的宽度约为150px。

任何人都可以帮助我这里发生的事情,以便在IE上看起来有些正常吗?

0 个答案:

没有答案