My Website on mobile keeps shifting left and right as i swipe

Store Design

Topic summary

A Shopify store owner reports their mobile website shifts horizontally when users swipe vertically, creating an unwanted scrolling effect. The issue only occurs on mobile devices.

Proposed Solutions:

Two CSS code fixes have been suggested:

  1. Add CSS targeting .banner__content with display:block to the base.css file
  2. Add overflow-x:hidden !important to the theme.css file

Both solutions involve editing theme files via Online Store > Themes > Edit Code.

Current Status:

The discussion remains partially unresolved. One user confirmed the second solution worked, but the original poster reported the first fix didn’t resolve their issue (though the helper claims the code wasn’t properly implemented). Additional users are now experiencing the same problem, with some unable to locate the specified base.css file in their theme structure. The helper offered to fix it directly with collaborator access.

Summarized with AI on October 31. AI used: claude-sonnet-4-5-20250929.
1

When i swipe down and swipe slightly to the left or right itll move my whole home page. I want the site to be just suck and be able tk swipe down cleanly. It is only happening on mobile. My site is BobaWicks.com and the pass is 1.

2

@BobaWicks You need to add this code in the theme files. For which you need to go to Online Store > Actions (Active theme) > Edit Code > Assets, under assets add the code at the bottom of base.css file.

@media only screen and (max-width: 600px) {
.banner__content{
display:block;
}
}
3

hello sorry it didnt work

4

@BobaWicks I have checked the code, it is not updated on the site. The code I gave is correct and working fine when I tested locally. If you are fine with giving collaborator access I can fix the issue.

5

Hi @BobaWicks

This is PageFly - Advanced Page Builder. I would love to give you some recommendations

-Go to Online Store->Theme->Edit code

-Asset → theme.css paste the below code at the top of the file.

@media (max-width:767px){

overflow-x:hidden !important

}

Best Regards;

PageFly

6

Hello NerdCurator, I am facing the same issue on mobile, I tried to implement the code that you attached at the bottom of the code file, refreshed the page on my phone, but it is still not working. Please any help will do.

7

it worked thank you so much

8

hello i have the same problem can you help me to? but i dont find: base.css file.