Discuss and resolve questions on Liquid, JavaScript, themes, sales channels, and site speed enhancements.
hi, i have changed my collection cards shape, reduce them in size, however now there is a huge gap between the text and image, how do I reduce it?
beautage.co
Solved! Go to the solution
This is an accepted solution.
@Beautage@Beautage, do this to fix it in 20 seconds:
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:
.card__inner.ratio {
margin-bottom: -40%;
}
@media (max-width: 749px){
.card__inner.ratio {
margin-bottom: -0%;
}
}
You can change the -40% value to any other number.
If it helps you please click on the "like" button and mark this answer as a solution!
Thank you.
Kind regards,
Diego
This is an accepted solution.
@Beautage@Beautage, do this to fix it in 20 seconds:
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:
.card__inner.ratio {
margin-bottom: -40%;
}
@media (max-width: 749px){
.card__inner.ratio {
margin-bottom: -0%;
}
}
You can change the -40% value to any other number.
If it helps you please click on the "like" button and mark this answer as a solution!
Thank you.
Kind regards,
Diego
Hi @diego_ezfy, that worked! however, now the featured collection section is messed up, and the add to cart button is overlapping with the product image, Is there any solution on how to adjust only the collection images and not the featured ones? thank you
@Beautage Oh, my bad, I forgot to apply it only to this section. Please remove the code I shared before and use this one instead:
.section-collection-list .card__inner.ratio {
margin-bottom: -40%;
}
@media (max-width: 749px){
.section-collection-list .card__inner.ratio {
margin-bottom: -0%;
}
}
Shopify and our financial partners regularly review and update verification requiremen...
By Jacqui Mar 14, 2025Unlock the potential of marketing on your business growth with Shopify Academy's late...
By Shopify Mar 12, 2025Learn how to increase conversion rates in every stage of the customer journey by enroll...
By Shopify Mar 5, 2025