Issue: On desktop, all sections share the same left/right margins, creating a rigid straight line. Goal is to adjust margins per section without affecting mobile.
Info shared: Store URL was provided upon request.
Proposed fix (global desktop tweak): Edit the theme CSS (Online Store > Themes > Assets > main.css/base.css/style.css/theme.css) and add a rule targeting the desktop slider component and the multicolumn isolate to set max-width: 100%.
Result: Desktop components expand to full width; a screenshot was shared to confirm the change. The OP reported success.
Follow-up: For section-specific changes, the guidance was to find the exact selector controlling that section’s width and override it accordingly. No detailed steps or mobile-specific safeguards (e.g., media queries) were provided.
Status: Partially resolved. A general CSS solution improved desktop layout; precise per-section margin control remains insufficiently detailed, so the discussion appears open.
Thanks for the info, check this one.
From you Admin page, go to Online Store > Themes
Select the theme you want to edit
Under the Asset folder, open the main.css(base.css, style.css or theme.css)
Then place the code below at the very bottom of the file.
slider-component.slider-mobile-gutter.page-width-desktop, .multicolumn .isolate {
max-width: 100%;
}
And Save.
Result:
Please don’t forget to Like and Mark Solution to the post that helped you. Thanks!
