Shopify themes, liquid, logos, and UX
Someone I was talking to about responsiveness problems in my company said this
"Upon reviewing your website, we identified that the large image display issue is related to a responsive design problem in your theme. Specifically:
The page allows horizontal scrolling, creating blank space on the left side of the screen.
This occurs because the maximum width exceeds the mobile viewport size, leading to overflow.
As a result, the things appear outside the visible area.
We recommend addressing the layout overflow issue to improve responsiveness "
I need help addressing this please, thank you
Hi @starpaint,
Go to Online Store, then Theme, and select Edit Code.
Search for base.css/theme.css/style.css/main.css/custom.css file Add the provided code at the end of the file.
html, body {
overflow-x: hidden;
max-width: 100%;
}
.container, .wrapper, .page-width {
max-width: 100vw !important;
overflow-x: hidden !important;
}
this added strange response in the desktop, there became a sliding bar in the description section and the page load was strange
2m ago Learn the essential skills to navigate the Shopify admin with confidence. T...
By Shopify Feb 12, 2025Learn how to expand your operations internationally with Shopify Academy’s learning path...
By Shopify Feb 4, 2025Hey Community, happy February! Looking back to January, we kicked off the year with 8....
By JasonH Feb 3, 2025