How to align entire website for mobile viewing?

Topic summary

  • Issue: On mobile, the storefront could be moved horizontally (sideways scroll), and the author wanted the layout locked to the viewport. Screenshots/links were provided to illustrate the misalignment.

  • Fix provided: In the theme editor, navigate to Themes > Edit code > Assets > section-image-banner.css and add a CSS rule to the banner section to prevent horizontal overflow. Key properties: width: 100% and overflow-x: hidden !important on the .banner selector (to constrain content and disable side scrolling).

  • Result: The author confirmed the CSS change worked perfectly and removed the horizontal scrolling on mobile.

  • Notes: Images/URLs were referenced for context but not required to implement the fix. No alternative solutions or disagreements were raised.

  • Status: Resolved. No pending questions or follow-up actions.

Summarized with AI on November 25. AI used: gpt-5.

Hey everyone,

What I would like to do is the following, align the website on mobile so you can not move it to the side. On the first picture you can see what I mean.

If you need it here is the url as well https://reussirwi.com

Thank you for any help!

Hi @Jacquline
To fix the problem, You can try follow this path:
Themes => edit code => asset => section-image-banner.css
and add this code to bottom of the file section-image-banner.css

.banner {
width: 100%;
overflow-x: hidden!important;
}

That worked perfectly, thank you so much!