Dawn theme out of the box responsiveness issue leading to overflow

Dawn theme out of the box responsiveness issue leading to overflow

starpaint
Excursionist
34 1 3

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

Replies 2 (2)

CodingFifty
Shopify Partner
525 80 99

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;
}

 

Coding Fifty || Shopify Partner
For any custom section queries, please visit: Fiverr Profile
Found my response useful? Like it and mark as Accepted Solution!
For additional discussions, reach out via: Email ID: codingfifty@gmail.com
starpaint
Excursionist
34 1 3

this added strange response in the desktop, there  became a sliding bar in the description section and the page load was strange