Streaming live at 10am (PST)

Mobile Views Scroll Right To Left


#1

Please Help.. I have tried many different settings and just cannot get rid of the extra space on right of my page when looking in the Mobile Phone views for a select few pages. Mainly NavHomePage.what I call HOME. This only happens after it has been FTP'd to your server and viewed on my Android phones.. 2 phones same issue for NavHomePage Directory .. also used same code on 5 other sub directories so if we can solve the issue here I will fix the others... thank you so much for the help. Bruceo

https://preview.webflow.com/preview/mywebapp123?preview=0be834407106b7a00edec475f8b60c8d

https://preview.webflow.com/preview/mywebapp123?preview=0be834407106b7a00edec475f8b60c8d


#2

Hello @bruceo,

There is few elements that is wider that screen or has a settings which moving objects out of screen view. All it can cause overflow on mobile and as result white area on the right side.

1) Remove left margin or make object width less than 100%

2) Container by default has width=100% on mobile, so by moving its positioning you create overflow. Here I would suggest to use padding instead.

3)This link has very big padding that create its minimal width 460px. I don't think you need that link to be so wide on mobile view

Hope it helps :smiley:

Cheers,
Anna


#3

Hello Thank you for the screen views.. My question was on the next page in my site Navigate Home page as I took a screen view to show you .. HMM I also have the same scrolling issues with the first page so I will use your help to fix the first page as well.. Thank you I will see if these corrections you gave will do the job .. THANK YOU FOR THE HELP. bruceo


#4

Well, here is screencast for further help
https://nimbus.everhelper.me/client/notes/share/video/351186/hwAFUOkkkXkm3Jpz9w6VNww94HRNvcBE/none/x5a1450149933955/video.webw

Regards,
Anna


#5

H Scrolling FIXED on first page.. but I am still stuck on the next page in my site... NavigateHome with the buttons... Please take a look .. I tried to remove OUTSIDE margins and only use padding.. a really good point you made... any ideas what is causing the issues? bruceo


#6

Reason of that issues - lines, that you create by adding "dash" (minus) characters. They become line, which is wider than screen.

I would recommend to remove them and use bottom border for list item elements instead:

https://nimbus.everhelper.me/client/notes/share/video/351212/P0eoeNX7KlG08t4BzCXK592IA5voC0DF/none/b711450154502318/video.webw


#7

Thank You Thank You Thank You!!! I realize what you have instructed... I have removed the dead space and now there is no scrolling Horizontal any more... !!!! Will take your ideas into consideration...
Have a nice day.. You have helped me so many times as I learn more and more.. bruceo


#8

:smile: Always welcome! Glad we could fix all issues!


#9

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