Shopify themes, liquid, logos, and UX
I have a multicolumn on my home page - Dawn Theme. How can I reduce the padding on the left & right side of the column (screenshot attached below)?
I would like to add the custom css only to this section. Thanks!
Hi @rjluna
Could you please provide your store password to check?
- Helpful? Like & Accept solution!
- Ryviu - Product Reviews & QA app: Collect customer reviews, import reviews from AliExpress, Amazon, Etsy, Walmart, Dhgate and CSV.
- Reton: Loyalty & Rewards - Earn points through tasks, redeem for discounts, and enjoy exclusive VIP rewards!
- Lookfy Gallery: Lookbook Image - Gain customers with photo gallery, video & shoppable image
- Reelfy‑Shoppable Videos+Reels: Create shoppable videos to engage customers and drive more sales.
- En...Sign up now.
Password: cornholeantics
Please add this CSS code at the Custom CSS of that section
.page-width {
max-width: 100% !important;
}
- Helpful? Like & Accept solution!
- Ryviu - Product Reviews & QA app: Collect customer reviews, import reviews from AliExpress, Amazon, Etsy, Walmart, Dhgate and CSV.
- Reton: Loyalty & Rewards - Earn points through tasks, redeem for discounts, and enjoy exclusive VIP rewards!
- Lookfy Gallery: Lookbook Image - Gain customers with photo gallery, video & shoppable image
- Reelfy‑Shoppable Videos+Reels: Create shoppable videos to engage customers and drive more sales.
- En...Sign up now.
It say's the css code is invalid. "Correct the errors to save your custom CSS.
Hi @rjluna
I hope you are doing good and welcome to the Shopify Community!
I am San from MS Web Designer.
Please add this css in your bottom of the base.css file:
.section-template--17743120236844__multicolumn-padding {padding-left: 10rem !important; padding-right: 10rem !important;}
Regards,
San
If it’s helpful to you, please mark it as a solution.
Need Help with Shopify Design, Migration, Speed, or Custom tasks?
email: hi@mswebdesigner.com
Try Our Conversion Booster app to get more sales | Connect Our Founder Linkedin
Will this code only apply to that section of the website and not the entire website? Thanks.
Hello @rjluna
1. In your Shopify Admin go to online store > themes > actions > edit code
2. Find Asset > base.css and paste this at the bottom of the file:
.multicolumn-card.content-container {
width: 100%!important;
}
.multicolumn .page-width {
max-width: 100%;
}
Is the there code I can add only that section and not the entire website? Thanks.
Hello @rjluna
1. In your Shopify Admin go to online store > themes > actions > edit code
2. Find Asset > base.css and paste this at the bottom of the file:
.multicolumn-card.content-container {
width: 100%!important;
}
.page-width {
max-width: 100%;
}
Thanks. This code works but it applies it to the entire website. I was hoping to only having it apply to that section.
You can make code apply to that section only by adding code in Custom CSS section in your Theme Customize of that section
- Helpful? Like & Accept solution!
- Ryviu - Product Reviews & QA app: Collect customer reviews, import reviews from AliExpress, Amazon, Etsy, Walmart, Dhgate and CSV.
- Reton: Loyalty & Rewards - Earn points through tasks, redeem for discounts, and enjoy exclusive VIP rewards!
- Lookfy Gallery: Lookbook Image - Gain customers with photo gallery, video & shoppable image
- Reelfy‑Shoppable Videos+Reels: Create shoppable videos to engage customers and drive more sales.
- En...Sign up now.
When I add that code to the Custom CSS section I get error: "Invalid CSS - certain At-Rules are not supported. Try using global CSS."
Discover how to increase customer engagement on your store with articles from Shopify A...
By Jacqui Apr 23, 2025Hey Community 👋 Did you know that March 15th is National Everything You Think Is W...
By JasonH Apr 1, 2025Discover how to increase the efficiency of commerce operations with Shopify Academy's l...
By Jacqui Mar 26, 2025