Why do my pages scroll over on mobile when trying to slide through images and products?

Technical Q&A

Topic summary

A mobile responsiveness issue was identified where pages scroll horizontally beyond their boundaries, revealing white space. This occurs particularly when users swipe through featured products and image galleries.

Root Cause:

  • Horizontal overflow on mobile viewports allowing content to extend past the page width

Solution Implemented:
Adding CSS code to the theme’s Custom CSS section:

  • Targets screens with max-width of 767px (mobile devices)
  • Sets overflow-x: hidden on html and body elements
  • Prevents horizontal scrolling while maintaining vertical functionality

Status: Resolved - The CSS fix was confirmed working by multiple users when added to the bottom of the theme’s CSS file.

Summarized with AI on November 8. AI used: claude-sonnet-4-5-20250929.
1

My website looks fine on desktop, but when viewing on mobile, you can scroll out of the boundaries of my site, showing nothing but white space. This is especially noticeable when trying to scroll through featured products and images.

If anybody has a solution to this, please let me know.

My store url is plazmask.com, and is built with the Influence theme.

2

I got it to work properly by adding this code to the Custom CSS section of my theme settings

@media screen and (max-width: 767px){
  html,body{
	overflow-x: hidden! important;
  } 	
}
1 Like
3

Worked for me to, just add to the very bottom of theme.css