Sorting products makes space between cards smaller
Hi everyone and thanks in advance for your help 🙂
Something weird is happening on my product grids when I sort the products using the Sort By options :
As you can see, the space between the product cards is deleted and cards touch each other. Now what's very weird is that it concerns only the third row of products. I have tried with bigger lists of products but it's always the third one that steps over the second (or get under it, I can't say). It only happens after I selected a sorting option in the Sort By menu... does anyone know why this happens and how to fix it ?
My test store link : https://cbdlissetheme.myshopify.com/
Password : teafla
Hey @shorty__ad,
Go to your theme's "Edit Code" Option, then in the search bar type "theme.liquid"
Below the tag "<head>" tag paste the following. Screenshot attached for reference.
<style>
.scroll-trigger.animate--slide-in {
transform: translateY(0) !important;
}
</style>
Screenshot is for reference only, the correct code to paste is the one shown above.
Hello @ThePrimeWeb !
Your solution works, but the problem is that putting this code in the theme.liquid file disabled the slide-in animation, which I'd like to keep. But I found out how to solve this : I edited the class you suggested directly in base.css file like this :
And it now works exactly as I wanted 🙂
Thank you for your help and have a very good day !
Hey @shorty__ad,
Go to your theme's "Edit Code" Option, then in the search bar type "theme.liquid"
Below the tag "<head>" tag paste the following. Screenshot attached for reference.
<style>
.scroll-trigger.animate--slide-in {
transform: translateY(0) !important;
}
</style>
Screenshot is for reference only, the correct code to paste is the one shown above.
Hello @ThePrimeWeb !
Your solution works, but the problem is that putting this code in the theme.liquid file disabled the slide-in animation, which I'd like to keep. But I found out how to solve this : I edited the class you suggested directly in base.css file like this :
And it now works exactly as I wanted 🙂
Thank you for your help and have a very good day !
