my website: www.onecap.se
cainte: https://cainte.se/
A user sought help aligning their collection page layout to match a reference site (cainte.se), noting their content was too far left with excess space on the right.
Solutions Provided:
Multiple developers offered CSS-based fixes:
padding: 0 !important; to the collection slider container in styles.css</head> tagmargin-left: 0 !important; to the product list classResolution:
The issue was successfully resolved. The original poster confirmed one of the solutions fixed the alignment problem completely, expressing gratitude after struggling with this issue multiple times previously.
Technical Context:
All solutions involved targeting specific CSS classes related to Shopify’s collection page layout, requiring edits to either styles.css or theme.liquid files through the theme code editor.
Hi @OneCap , go to styles.css and add the following code:
.section-id-template--18942649893209__16359278676808bea5.collection-slider-row .container {
padding: 0 !important;
}
Hi @OneCap
This is Richard from PageFly - Shopify Page Builder App
Please add this code to your theme.liquid above the to get this solved
Step 1: Online Stores > Themes > More Actions > Edit code
Step 2: click on theme.liquid and paste the code above the
Hope this can help you solve the issue
Best regards,
Richard | PageFly
Hello @OneCap ![]()
In Shopify Admin, you can go to Edit theme code, open file styles.css and add this code at the bottom
.collection-listing .product-list {
margin-left: 0 !important;
}
The result
Hope that helps!
wow, THANK YOU SO MUCH BROTHER! this really fixed the whole issue. Been asking so many times and you finally got me what I wanted! Thank you bro!! ![]()
Glad that my solutions work for you ![]()