Query regarding new Canvas Resizing feature

I decided as a test to utilise the vw unit for some header text on a site i am working on now.

In the designer view i set the mobile portrait to Nexus 4 view size via the new resizing feature.
I then jumped onto my actual nexus 4 device and displayed the same page on my phone to compare.
It seems the text in question is not displaying the same as in the designer view.

Here it is in the designer view;

and here it is on my phone (screenshot taken)

As you can see the header text is slightly different on each picture, the word ‘accredited’ should be on the third line, is this just the way its supposed to be, or does text just render differently on the actual device???

That’s something I’ve also noticed when jumping from the Designer Window to an actual device ( iPad, iPhone, etc. ) I’ve tried resizing a browser window to simulate a mobile device on desktop, but the way the text shows up differently on a mobile device probably indicates a difference in how text is rendered. Best way is to have the Designer Window and the actual device out, refreshing the device window after each publish.

It could be because of the way different browsers and devices render text. Have you tried any other different mobile browsers and tested them there?

yes i tried it on mobile Firefox, and it does display it correctly as per the Webflow designer view.
So it seems its just a Chrome issue.

Also noticed that the ‘phantom click’ issue i was having in Chrome does not appear on Firefox. That is when u click a drop down link within a nav bar, and the browser (in this case, Chrome) decides to auto select the first nav link within that drop down.

This topic was automatically closed 7 days after the last reply. New replies are no longer allowed.