Unknown Padding on Site - Help with removing it

Topic summary

A user encountered unexpected horizontal padding appearing on the right side of their Shopify store, affecting all pages and particularly problematic on mobile devices.

Key Details:

  • Store uses the PIPELINE theme
  • Site was just launched, making the issue urgent
  • Initial troubleshooting found no obvious HTML or CSS errors

Resolution:

  • User self-resolved by adding CSS code to the theme.scss.liquid file:
body, html {
  overflow-x: hidden;
}

This CSS solution prevents horizontal scrolling by hiding any content overflow on the x-axis. The issue is now resolved.

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

Hi!

I am stumped as to why my site suddenly has an excess of what appears to be padding off to the right side.

This issue is super annoying especially for mobile.

I am unsure if it’s a coding issue, or an issue with image files. But the problem persists no matter what page you are on. Coding wise, I can’t seem to find any issues with our HTML or CSS.

Any help or insight would be suuuuper appreciated as we just launched the site today & I don’t want to revert back to our old theme.

(Using PIPELINE theme)

Store site: https://www.clarasunwoo.com/

Ended up answering it myself.

Solution: add the following code at the bottom of your assets/theme.scss.liquid file

body, html {
    overflow-x: hidden;
}

Voila!