Hi guys,
Would like to align product review stars in product card to be in the middle between add to cart button and price, and must not change if product title enlarged.
Thank you,
Topic summary
A user seeks to vertically center product review stars on their product cards, positioning them between the price and add-to-cart button, while ensuring alignment remains consistent regardless of product title length.
Proposed Solutions:
- One suggestion involves removing two
<br>elements that currently separate the stars from the product title, which should bring the stars closer to other elements. - Another recommendation provides CSS code to be added to
theme.scss.cssthat targets specific grid item classes and setsdisplay: noneon certain elements.
Current Status:
- The CSS solution was tested but reported as unsuccessful.
- The discussion remains open with no confirmed resolution, and the original poster is still seeking a working fix for the alignment issue.
1 Like
There’s two
elements in between, remove them and your review stars should be closer to the product title
In which page?
Hello There,
- In your Shopify Admin go to online store > themes > actions > edit code
- Find Asset >theme.scss.css and paste this at the bottom of the file:
li.grid__item.small--one-half.medium-up--one-quarter br {
display: none;
}
Didn’t work