How to reduce the collections card heights extra space in the bottom? DAWN THEME

[justauser]

On my site home page, I am using a collections component but there seems to be an issue with the bottom padding of the collection card right below the collection’s names, as you can see in the picture below:

the red up and down arrow indicates the extra space that is on the card below the card’s name, is there a way to get rid of this extra space? and just automatically let the name be there only?

URL: ABBASI (abbasigems.com)

Password: testingpage

Thank you, any help or sources are much appreciated!

[suyash1]

@justauser - please add this, it should reduce some space

.card__heading {min-height: initial;}

[justauser]

Hi @suyash1 , Does this code effect all the cards in the website or just the specific ones in the collection component? if so no, is there a way to target just the collection components cards

[harivishwakarma]

Hallo @justauser

You can add code by following these steps to change

1. Go to Online Store → Theme → Edit code > assets > base.css

paste below code at bottom(base.css)

.card-wrapper .card.card--standard.card--media {
padding-bottom: 0 !important;
}
.collection-list .card__content .card__information {
padding-bottom: 0 !important;
}
.collection-list .card__information h3.card__heading {
min-height: 0px !important;
}

If the answer is correct then like and accept the solution.

If you require any further information, feel free to contact me.

Best regards,

[shubhamSharma]

@justauser

step 01:

1. Go to your Store > Theme > click to edit code.
2. find this file "theme.liquid " and open.

step 02:

1. Paste the code at the end of the file.

this idea helps you

[Maria74]

Hi - this same solution is not working for me. Would you know why? Below is an image of the space I see between images and the numerical slider. I am also using the dawn theme.