Make card background same height

[kirsten11123]

Hello!

I've coded in a card background for products, however I can't work out how to get them to all be the same height?

I don't want to change font sizes or have the text clipped to ...

Also - can anyone work out how to make the product title line height closer together? I tried my usual codes and I couldn't get it!

Thanks 🙂

[ZestardTech]

Hi @kirsten11123 

1. In your Shopify Admin go to online store > themes > actions > edit code
2. Find Asset > theme.css and paste this at the bottom of the file:

.product-item__product-title a {
min-height: 50px;
display: block;
}

[kirsten11123]

Thank you, this worked, however now there's a big gap between the product content. Is there a way to center this information to the middle of the card?

[ZestardTech]

Hi @kirsten11123 

1.In your Shopify Admin, go to Online Store > Themes > Customize.
2.Select Home page -> Add section -> Featured products

[Rahul_dhiman]

Hello @kirsten11123 , to increase the card height--->
Go to online store ---------> themes --------------> actions -------------> theme.css----> line number 10143
and replace with

  .product-item__inner:hover, .product-item__inner:focus-within {
        z-index: 1;
        min-height: 420px;
    }

then search----> featured-collection.liquid  and  add this code at the very bottom of the file , with in style tag.

<style>
.featured-collection-slider__product.carousel__slide.swiper-slide.swiper-slide-visible.swiper-slide-next {
    min-height: 420px;
}</style>

 let me know if this worked.
Thanks