Why are my elements moved after being exported to svg


I'm quite new to Adobe Illustrator, but used to PS.

I wanted to experiment with Illustrator to create SVGs that can than be manipulated with JavaScript.

I created some kind of background-layer and filled it with a rect. That has a pattern as background-image (Adobes Waffelmuster - Doppelt).

I then created a second layer and added several filled paths to it. I tried to align these paths as best as I could to the background-pattern of my first layer.

When I export my graphic as SVG, my paths are not aligned to the background as in Illustrator. It seems they shifted a little bit to the right. Also, if I zoom in Firefox (STRG,+) the mismatch becomes even bigger.

Why is that and how can it be prevented? Is there something like relative and absolute positioning?

5/11/2013 6:56:00 PM

Try to check "Preserve Illustrator editing capabilities" while saving, it should fix the problem.

Moreover, be sure that:

  • "responsive" is not checked
  • your artwork isn't bigger than your canvas
  • your canvas' size doesn't contains decimal values

I use Illustrator to generate .svg for the web and it works pretty well.

Illustrator save as popup

7/27/2015 2:28:00 PM