Highlighted

Mobile view width issues

New Here ,
Jan 01, 2018

Copy link to clipboard

Copied

When viewing my website on my mobile (I have only tested on my mobile) the top navigation bar seems to be a little wider than than the main content. So therefore when I scroll up some of the navigation bar gets hidden behind my top mobile icons. To solve this I have to zoom out with my fingers after loading the page and then you can see that there is more space down the right side of the site.

My website is www.webbysmith.com

I hope this makes sense....

Adobe Community Professional
Correct answer by fotoroeder | Adobe Community Professional

Although it doesn't look too bad on my phone, you may have some elements outside the canvas on mobile. Watching in the developer section of Safari, for very small devices, this issue comes up more obvious, but as written, on my phone it looks almost perfect:

Bildschirmfoto 2018-01-02 um 08.07.36.png

Also on desktop and "faking" mobile, I was not able to reach your following pages, this was no problem on phone.

On phone everything AND images was nicely visible, while on desktop I get called something like this (but only using the developer tool from Safari, not when shrinking the window):

Bildschirmfoto 2018-01-02 um 08.11.14.png

So I recommend to check properly your mobile breakpoints, hoping you have not set 320 as breakpoint but as mimimum width, for elements outside the canvas and it should be pretty good.

Best Regards and a happy new year  ,

Uwe

Views

136

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more

Mobile view width issues

New Here ,
Jan 01, 2018

Copy link to clipboard

Copied

When viewing my website on my mobile (I have only tested on my mobile) the top navigation bar seems to be a little wider than than the main content. So therefore when I scroll up some of the navigation bar gets hidden behind my top mobile icons. To solve this I have to zoom out with my fingers after loading the page and then you can see that there is more space down the right side of the site.

My website is www.webbysmith.com

I hope this makes sense....

Adobe Community Professional
Correct answer by fotoroeder | Adobe Community Professional

Although it doesn't look too bad on my phone, you may have some elements outside the canvas on mobile. Watching in the developer section of Safari, for very small devices, this issue comes up more obvious, but as written, on my phone it looks almost perfect:

Bildschirmfoto 2018-01-02 um 08.07.36.png

Also on desktop and "faking" mobile, I was not able to reach your following pages, this was no problem on phone.

On phone everything AND images was nicely visible, while on desktop I get called something like this (but only using the developer tool from Safari, not when shrinking the window):

Bildschirmfoto 2018-01-02 um 08.11.14.png

So I recommend to check properly your mobile breakpoints, hoping you have not set 320 as breakpoint but as mimimum width, for elements outside the canvas and it should be pretty good.

Best Regards and a happy new year  ,

Uwe

Views

137

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Jan 01, 2018 0
New Here ,
Jan 01, 2018

Copy link to clipboard

Copied

Sorry I should clarify...

All content is set to be responsive and to adjust to browser width. So there should be no difference in width

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Jan 01, 2018 0
Adobe Community Professional ,
Jan 01, 2018

Copy link to clipboard

Copied

Although it doesn't look too bad on my phone, you may have some elements outside the canvas on mobile. Watching in the developer section of Safari, for very small devices, this issue comes up more obvious, but as written, on my phone it looks almost perfect:

Bildschirmfoto 2018-01-02 um 08.07.36.png

Also on desktop and "faking" mobile, I was not able to reach your following pages, this was no problem on phone.

On phone everything AND images was nicely visible, while on desktop I get called something like this (but only using the developer tool from Safari, not when shrinking the window):

Bildschirmfoto 2018-01-02 um 08.11.14.png

So I recommend to check properly your mobile breakpoints, hoping you have not set 320 as breakpoint but as mimimum width, for elements outside the canvas and it should be pretty good.

Best Regards and a happy new year  ,

Uwe

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Jan 01, 2018 0