IEバグ：ビューポートの外に見えるSVGマーカー

外部要素にoverflow：hidden属性があってもマーカーパスが表示されるInternet Explorer 11のバグを発見しました。ここでIEバグ：ビューポートの外に見えるSVGマーカー

ここexample of the described problem（IE11で表示する必要がある）

は、コードサンプルです：問題の

<!DOCTYPE html> 
<html> 
    <head></head> 
    <body> 
    <div style="width: 440px; height: 495px; overflow:hidden; border: 1px solid red"> 
    <svg> 
     <g transform="translate(413.209 51.1721) scale(0.514057)"> 
     <defs><marker id="end" viewBox="0 0 10 10" refX="0" refY="5" markerUnits="userSpaceOnUse" markerWidth="10" markerHeight="10" fill-opacity="1" fill="#888" orient="auto" class="arrowhead"><path d="M 0 0 L 10 5 L 0 10 z"></path></marker></defs>   
     <path marker-end="url(#end)" style="fill:transparent; opacity: 1; stroke: #000; stroke-opacity: 1;" d="M323.921875,-19.2421875H-465.20818355008544V961.2877197265625H-465.20818355008544V981.2877197265625"></path> 
     </g> 
    </svg> 
    </div> 
    </body> 
</html>

画像：私が期待したもの

マーカーも隠されているということです。誰も前に同じことを経験したことがありますか？

これは、100％より大きい、または小さいズームが使用されている場合にのみ発生します。

出典

2016-09-12 d.h.

私はCSS3の変換やオーバーフローの上で同様の問題については、次の記事に出くわした：

svg { opacity: 0.99; }

これは、問題を解決：使用する提案がありました

https://jbkflex.wordpress.com/2013/04/04/css3-transformations-showing-content-outside-overflowhidden-region-in-firefoxandroid/

：隠されました。

これがなぜ機能するのかは、z-インデックスの仕組みに関係している可能性があります。このトピックの記事はこちらからご覧ください： https://philipwalton.com/articles/what-no-one-told-you-about-z-index/

出典

2016-09-13 07:55:45

IEバグ：ビューポートの外に見えるSVGマーカー

答えて

関連する問題