Aligning reviews and prices on collection page

Solved
bousy
Tourist
3 0 0

Hello I would like to ask anyone if you could help me out aligning prices and reviews on the same level. This happens when the name of a product is too long and therefore its not how it should be and looks off. I would be grateful if anyone could fix this issue.

fix.jpg

0 Likes
JHKCreate
Shopify Partner
1965 316 420

Hi There!

Sure thing, would you mind sharing your store's URL please? We will limit your title to 2 lines so that everything is aligned.

- Did we solve your issue? Like & Mark As Solution to help the community
- Should you need any direct help: contact@jhkcreate.com
JHKCreate
Shopify Partner
1965 316 420

Please add the following code to your theme.scss.css file at the very end:

 

.grid-view-item.product-card {
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    line-height: 1rem;
    overflow: hidden;
    display: -webkit-box;
    text-overflow: ellipsis;
    min-height: 35px;
    margin-bottom: 5px;
}

 


Let me know! Cheers! 

- Did we solve your issue? Like & Mark As Solution to help the community
- Should you need any direct help: contact@jhkcreate.com
bousy
Tourist
3 0 0

Hello it doesnt do what I want it to do. Here is what it does.

2nd.jpg

0 Likes
JHKCreate
Shopify Partner
1965 316 420

This is an accepted solution.

That should do it!

.h4.grid-view-item__title.product-card__title {
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    line-height: 1rem;
    overflow: hidden;
    display: -webkit-box;
    text-overflow: ellipsis;
    min-height: 35px;
    margin-bottom: 5px;
}
- Did we solve your issue? Like & Mark As Solution to help the community
- Should you need any direct help: contact@jhkcreate.com
bousy
Tourist
3 0 0

Thank you works perfectly.

0 Likes

Hi 

I have the same problem using brooklyn theme, I want to align the stars of product review in the collection page, just below the product title, could you help me?

site URL is www.fudoon.fr

thanks for your help

 

M

0 Likes