1 Reply Latest reply: Oct 21, 2014 9:59 AM by Zak Williamson (Adobe) RSS

    %100 width SVG image causing issues with layering and transparent border

    Shutterlab Community Member
    Shutterlab Oct 20, 2014 5:34 PM

      I have a %100 width SVG I am using as a background image which is causing other SVGs and content areas that are stacked on top of it to disappear. Some of the items have scroll effects applied.The file size is 23920 Kb on the offending SVG.

       

      I've also noticed that despite artboard settings and how I save the SVG in Illustrator there is always a transparent border around the image preventing horizontal tiling.

       

      1. Are there any known bugs to explain composited SVGs disappearing?

      2. Does anyone have an ideas on how best to eliminate the border around an SVG saved from Illustrator?

        • 1. Re: %100 width SVG image causing issues with layering and transparent border
          Zak Williamson (Adobe) Employee Hosts
          Zak Williamson (Adobe) Oct 21, 2014 9:59 AM (in response to Shutterlab)

          If you really do mean 24Mb, you really don't want to do that. A 24Mb SVG will take well over 30 seconds to download on a typical US broadband connection and much longer on slower connections. Most site visitors won't stick around for that. Once loaded it will be very complex for the browser to draw (a huge number of vectors) and will likely slow the performance of the page. It may in fact be causing the browser to fail to draw other items. Without knowing more about what you're attempting to achieve and why a 24Mb SVG might be desirable, it's difficult to know what approach to recommend, but you're likely much better off using an image for this case.