Javascript IE中的SVG视图框行为

我有这个SVG，通过使用

viewBox

属性，我可以在其中移动并查看它的每个部分

上图中的黄色框是一个恒定的400x400 SVG，其宽度和高度不变

<svg xmlns="http://www.w3.org/2000/svg" viewBox="17900 -4100 1050 1050" preserveAspectRatio="none" width="400" height="400">

当我垂直滚动时，所有东西都会在框内移动，但Internet explorer（11）的行为不同

像这样：

尽管SVG的高度和重量是400x400，但IE并不在意，它会离开SVG容器！ Internet explorer如何在SVG元素之外绘制？我怎样才能修好它

另外，在这两个示例中，只有viewBox属性发生了更改

编辑：

---

Chrome和Firefox在SVG元素中绘制所有形状，但Internet Explorer没有。不需要它，但您可以将

溢出：隐藏
添加到SVG中

svg {
  background-color: khaki; /* rgba(216, 210, 210, 0.06); */
  overflow: hidden;
}

应该不需要它，但您可以将
溢出：隐藏
添加到SVG中

svg {
  background-color: khaki; /* rgba(216, 210, 210, 0.06); */
  overflow: hidden;
}

viewBox是如何更改的？@RobertLongson通过在浏览器的元素检查器中简单地更改它，我添加了一个JSFIDLE，请在IE和其他浏览器中尝试一下，看看我在说什么。例如，将viewBox=“19250 2100 800 800”更改为viewBox=“19000 2100 800 800”，即使您不更改默认的viewBox属性，IE也可能在元素外部绘制它。我想知道IE元素检查器是否工作正常（它可能主要用于html）。在不使用该选项的情况下进行测试可能会得到不同的结果。@RobertLongson我尝试使用javascript更改viewBox.baseVal，但仍然一样。您是否在internet explorer中打开了我的JSFIDLE？您应该更新您的测试用例以显示此内容。viewBox是如何更改的？@RobertLongson只需在浏览器的元素检查器中更改它，我就添加了一个JSFIDLE，请在IE和其他浏览器中试用，看看我在说什么。例如，将viewBox=“19250 2100 800 800”更改为viewBox=“19000 2100 800 800”，即使您不更改默认的viewBox属性，IE也可能在元素外部绘制它。我想知道IE元素检查器是否工作正常（它可能主要用于html）。在不使用该选项的情况下进行测试可能会得到不同的结果。@RobertLongson我尝试使用javascript更改viewBox.baseVal，但仍然一样。您是否在internet explorer中打开了我的JSFIDLE？您应该更新您的测试用例来显示这一点。我认为SVG 2建议溢出的默认值应该更改，因此在外部
元素上以您想要的方式定义溢出是一个很好的做法。我认为SVG 2建议溢出的默认值应该更改，因此这是一个很好的做法以您希望的方式在外部
元素上定义它。