Shopify themes, liquid, logos, and UX
Hey, wassup community
I coded a FOMO creating countdown timer snippet, just added {% render 'cart-timer' %} and it worked well. But I've got some unwanted side padding there, and I have no idea why, it doesn't has to anything with the timer itself, the snippet has 0 side padding. Would appreciate help
Hello, @lf-ecom-shops
May I ask which part of the padding you are referring to? Can you point it out and provide the store URL so that I can assist you.
I mean the side padding, my store url is: 3f7f0b-90.myshopify.com and the password: 123
I mean from the cart timer I made, as you see in the picture
Since the width is 100%, changing it to this property will remove padding
Hopefully it will help you. If yes then Please don't forget hit Like and Mark it as solution!
Oh sorry, that's not what I meant, I meant there shouldn't be this white space on the sides, these should be im the blue, so that it's full width, I made it full width and 0 side-padding, but the white side space is still there
Do you want this effect?
Yeah
Hello @lf-ecom-shops,
Paste this code in base.css in the bottom if the file.
.drawer__cart-items-wrapper{
padding: 0rem 1.5rem !important;
}
.drawer__header{
padding: 0rem 1.5rem !important;
}
.drawer__inner.gradient.color-scheme-1{
padding: 0rem 1.5rem !important;
overflow: hidden;
}
.drawer__footer {
padding: 1.5rem 3rem !important;
}
.cart-items thead{
padding: 0rem 1.5rem !important;
}
Thanks!
Thanks but I tried it aswell haha, I am a coder and full-stack-developer, but that didn't work, tried it now again, still didn't work
You can add code by following these steps
1. Go to Online Store -> Theme -> Edit code.
2. Open your theme.liquid file
3. Paste the below code before </body> on theme.liquid
drawer__cart-items-wrapper{
padding: 0rem 1.5rem !important;
}
.drawer__header{
padding: 0rem 1.5rem !important;
}
.drawer__inner.gradient.color-scheme-1{
padding: 0rem 1.5rem !important;
overflow: hidden;
}
.drawer__footer {
padding: 1.5rem 3rem !important;
}
.cart-items thead{
padding: 0rem 1.5rem !important;
}
You can try this code by following these steps:
Step 1: Go to the online store ->Theme ->Edit Code.
Step 2: Find the theme.liquid file and add the following code above the </head> tag
<style>
.drawer__inner{
padding: 0 !important;
}
.drawer__header,
.drawer__footer{
padding: 1.5rem !important;
}
.drawer__cart-items-wrapper {
padding: 0 1.5rem;
}
</style>
Learn how to expand your operations internationally with Shopify Academy’s learning path...
By Shopify Feb 4, 2025Hey Community, happy February! Looking back to January, we kicked off the year with 8....
By JasonH Feb 3, 2025Expand into selling wholesale with Shopify Academy’s learning path, B2B on Shopify: Lau...
By Shopify Jan 28, 2025