IEのSVG viewBoxの動作

Question

私はこのSVGを持っていて、viewBoxという属性を使って、その中に移動してそのすべての部分を見ることができます。

あなたは上記の画像に表示されて黄色のボックスには、一定の400x400のSVGあり、それの幅と高さは変更されません。私は垂直方向にスクロールすると

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

、Eveythingは、ボックス内を移動するが、インターネットエクスプローラ（11）は、動作が異なります。このよう

：

SVGの身長と体重は400x400のですが、IEは気にしてSVGコンテナの外に移動しませんが！ インターネットエクスプローラはSVG要素の外にどのように描画できますか？どうすれば修正できますか？

P.S.どちらの例でも、viewBox属性のみが変更されました。

編集：https://jsfiddle.net/omidh/unjq6h0c/

ChromeとFirefoxはSVG要素内のすべての図形を描くが、Internet Explorerはしません。

Answer 1

これは必須ではありませんが、overflow: hiddenをSVGに追加することができます。

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