As you can see, when viewing on a mobile device, there is a large white space to the right of the main body. I cannot figure out what element on the page is creating this white space. Can anyone help me?
Thanks,
Richard
Here is my public share link: LINK
(how to access public share link)
Hi @moserrw
Try clicking on the blank white space and giving it a CSS class of Body under the selector tab.
Then go to the overflow section under Display Settings and toggle “Hidden”.
Hope this helps!
Hi @moserrw and @SPI 
Thanks for the tip @SPI, setting the body to overflow hidden will certainly fix the overflow when on mobile portrait, but it will also prevent the user from scrolling down on the page.
When taking a look at the site in Read-Only mode, on the mobile portrait view, it seems that the Hero Heading class is causing the overflow, due to a combination of the font size, line-height and text spacing styles.
One suggestion I would have, is to reduce the font stylings in the Hero Heading on mobile view to fit within the mobile viewport, that way, the overflow will be fixed, and you do not need to set overflow hidden on the whole page.
Take a peek at some styling on the mobile portrait view, on the Hero Heading class, that for me, seems to correct the overflow 
I hope this helps!
This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.
