Internet Explorer draws SVG out of its element

Won’t fix Issue #7226597

Details

Author
omid h.
Created
Apr 16, 2016
Privacy
This issue is public.
Found in
  • Internet Explorer
Reports
Reported by 3 people

Sign in to watch or report this issue.

Steps to reproduce

I have this SVG and by using viewBox attribute, I can move in it and see every part of it.
First
The yellow box you see in picture above is a constant 400x400 SVG and the width and height of it doesn’t change.
<svg xmlns="http://www.w3.org/2000/svg" viewBox="17900 -4100 1050 1050" preserveAspectRatio="none" width="400" height="400">
When I vertically scroll, Eveything moves inside the box but Internet explorer(11) behaves differently.
Like this:
Second
Even though the SVG height and Weight are 400x400 but the IE doesn’t care and moves out of SVG element! How can Internet explorer draw outside of SVG element? How can I fix it?
P.S. In both examples, Only viewBox attributes changed.
https://jsfiddle.net/omidh/unjq6h0c/
Chrome and Firefox draw all shapes inside the SVG element but Internet Explorer doesn’t.

Attachments

0 attachments

    Comments and activity

    • using "overflow: hidden: fixed the problem in IE.

    • Microsoft Edge Team

      Changed Assigned To to “Ray X.”

      Changed Assigned To to “Brad E.”

      Changed Status to “Won’t fix”

    • Thank
      you for the feedback. This issue appears to have been fixed in Microsoft Edge.
      We’re not presently working on feature bugs in Internet Explorer outside of
      security-related issues. If you have a premier support contract you can visit https://premier.microsoft.com and open
      a support incident and work with an engineer to address this issue.

      Best
      Regards,

      The
      Microsoft Edge Team

    You need to sign in to your Microsoft account to add a comment.

    Sign in