被 IE10 弄乱的 SVG 图像的宽度/高度答案

【问题标题】：width/height of SVG image messed up by IE10被 IE10 弄乱的 SVG 图像的宽度/高度
【发布时间】：2017-08-23 10:41:33
【问题描述】：

我有一个 SVG 图像，上面有可点击的 SVG 多边形和一些悬停图像效果。在每个浏览器中都可以正常工作，当然除了 IE。实际上 edge (12 + 13) 和 IE 11 都很好。甚至 IE10 (Metro) - 但不是 IE10 最新版（在 Browserstack 中测试过）。

由于必须通过图像才能看到这一点，所以我在这里提出了一个工作示例（除了 IE10 之外工作良好）： SVG clickable images

所以点击那个链接你可以看到它应该是什么样子（同样，除了 IE10），这是 Browserstack 的屏幕截图，它在 IE10 最新版本中的样子：

因此，在这种特定情况下，黑白图像（背景）——而不是像其他 svg 内容那样具有 7.5% 的左边距和 85% 的宽度——被高度调整大小，这似乎是100%，从而导致 SVG 的分层不正确。

我真的不知道是什么原因造成的 - 非常感谢任何帮助！

【问题讨论】：

【解决方案1】：

您似乎只为<svg> 元素提供了width（即没有高度）。因此，您的问题可能是 IE SVG 缩放错误。有关解决方法，请参阅以下问题。

【讨论】：