Skip to main content
M
mj56564071
Participating Frequently
August 2, 2017
Answered

SVG aligment incorrect

  • August 2, 2017
  • 2 replies
  • 4272 views

Hi there,

I want to export an vector in .svg trough Illustrator. When I open the .svg file in the browser it's centered horizontal and vertical. While normally it shows up in the top left corner. Since this image is used on a website and needs to be responsive, this incorrect export/save is an issue for me.

Things I tried:

  • Change export settings to all possible options
  • Export trough save as, and than choose svg
  • Checked the document on clipping masked and trimmed them were needed.
  • Checked artboard option while using save as.
  • Made a new document and exported the new document.

None of these things solved the problem, so i'm looking for the solution here.

Thanks in advance!

    This topic has been closed for replies.
    Correct answer Monika Gause

    Already tried that, but the problem still exists.


    Please try exporting via "Save for screens" which will produce better code than "Saving as"

    Additionally you can always make SVG responsive when embedding it

    Making SVGs Responsive with CSS

    2 replies

    ShivendraAgarwal
    ShivendraAgarwal
    Participating Frequently
    August 2, 2017

    can you please share the svg you saved through AI.

    and also share an ai file, so that we may see where exactly have you placed your artwork.

    M
    mj56564071Author
    Participating Frequently
    August 2, 2017

    The ai: https://ufile.io/imu9o

    The svg: https://ufile.io/q1bqi

    Monika Gause
    Community Expert
    Monika GauseCommunity Expert
    Community Expert
    August 2, 2017

    Check the responsive setting when exporting.

    Monika Gause
    Community Expert
    Monika GauseCommunity Expert
    Community Expert
    August 2, 2017

    Which version?

    How do you define "normally"?

    Normally when you do it or normally for every other file you open?

    M
    mj56564071Author
    Participating Frequently
    August 2, 2017

    Any other time i exported a file to .svg and open it in my browser, it shows in the top left corner.

    SVG: 1.1

    Illustrator: CC 21.1.0 64-bit

    Computer: Windows 10 Pro

    Terms & ConditionsAccessibility statement
    Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices