SVG problem on breakpoints

Forum|Forum|9 years ago
November 21, 2016
1 reply
213 views

Hi!

I have a problem on SVG upon publishing. Viewing the SVG object on desktop is perfectly fine but when it comes to breakpoints, the problem occurs esp. on mobile.

It will be fixed if you rotate your screen, and I'm using the latest Adobe Illustrator for the SVG. Below is the screen shot for reference. (Used IE for testing purposes)

This topic has been closed for replies.

Lilybiri

Legend

Hi Cyrille,

Maybe you are not aware of the fact that you can insert an image and a video in a thread:

Which version of IE (not the 'best' browser for HTML output at all, developing discontinued now that Edge appeared)? Did you try with other browsers?

How did you set up the position panel for the SVG in the breakpoints for landscape tablet and mobile? Do you have 5 breakpoints? The default 3 breakpoints are: desktop landscape, tablet portrait and mobile portrait.

C

cyrille_miascoAuthor

Participant

Hi Lily!

I'm aware just copy my link that I post on your blog and just paste the link on the "Insert Image".

Anyways, I'm using IE 11 but when testing the course I preview it also on Chrome. And upon testing on mobile, I usually use Safari & Chrome. For the set up of the SVG, set it 24.5% rel, center horizontally. I have 5 breakpoints but since the client needs landscape so I have 3 landscape breakpoints, I just disregard the layout for portrait and we just inject a code for portrait view. For each breakpoints I have different scale for each breakpoints. Desktop is 1000px x 600px, landscape tablet is 896px x 627px and landscape mobile is 667px x 410px.

Lilybiri

Legend

The image you inserted that way is not rescalable, reason I commented about it.

What is the height setting for the SVG? It should be Auto.

You cannot ignore the Portrait breakpoint views, AFAIK you cannot even delete them. It is always a hassle to get everything working of all devices. Really cross my fingers that the work flow will improve. What is the 'code' you are talking about?

Sign up

To post, reply, or follow discussions, please sign in with your Adobe ID.

Sign in to Adobe Community

To post, reply, or follow discussions, please sign in with your Adobe ID.

Scanning file for viruses.

This file cannot be downloaded