Like this. my web：www.bmcarcover.com
Topic summary
A Shopify store owner reports that half of their mobile page (bmcarcover.com) displays as blank space, as shown in an attached screenshot.
Proposed Solutions:
-
CSS overflow fix: Add
overflow-x: hiddenandmax-width: 100%rules to the CSS file to prevent horizontal overflow issues -
Implementation guidance: Insert CSS code in the theme.liquid file before the
</head>tag, with a before/after screenshot demonstrating the fix -
Root cause identification: The issue may stem from specific code in theme.liquid or footer.liquid files (referenced in an attached screenshot)
The original poster indicated difficulty locating where to add the CSS code. Multiple community members provided step-by-step instructions for accessing the theme code editor and implementing the fix.
Hi,
Hope this will work
- Open Your Theme Code and Check for “overflow” or “width” Problems in CSS
add this safe fix at the bottom of your CSS file (if you are not sure about the problem)
CSS example
body {
overflow-x: hidden !important;
}
html, body {
max-width: 100% !important;
}
I didn’t find where to add this css
Hi @Jim_65 ,
- Go to Online Store → Theme → Edit code.
- Open your theme.liquid file
- In theme.liquid, paste the below code before
Result:
If my reply is helpful, kindly click like and mark it as an accepted solution.
Thanks!
Use our Big Bulk Discount app to boost your sales! 
(https://apps.shopify.com/big-bulk-discount). Easy to set up and perfect for attracting more customers with bulk discounts. Try it now and watch your revenue grow!
