Center the Stars of Ali Review, need help plz

Highlighted
New Member
1 0 1

<div style="text-align: center">
<span class="shopify-product-reviews-badge text-align:center" data-id="{{ product.id }}"></span>
</div>

1 Like
Highlighted
New Member
2 0 0

Hi I have the same problem with my website the url is: https://fit-o-city.com/collections/all. If you click on it on a mobile device you can see that the stars are not centered. does anyone know the code and placement of the code needed to change that?

0 Likes
Highlighted
Shopify Partner
1730 209 350

@fitocity add this snippet to the bottom of your assets/theme.scss.liquid file:

@media only screen and (max-width: 989px)
.product-item__meta__inner {
    text-align: center;
}
Sergiu Svinarciuc | CTO @ visely.io
- Was my reply helpful? Click Like to let me know!
- Was your question answered? Mark it as an Accepted Solution!
- To learn more about the awesome stuff we do head over to visely.io or our blog
0 Likes
Highlighted
New Member
2 0 0

do I have to put that at the bottom fo the whole code line itself or in a specific place because when I did it it completely dismantled the website.

0 Likes
Highlighted
Shopify Partner
1730 209 350

Put it at the bottom of the file, make sure you have a new line before adding the code. Make sure you are trying things out on a copy of the theme. You can also try wrapping the lines in curly braces like so:

@media only screen and (max-width: 989px) {
  .product-item__meta__inner {
      text-align: center;
  }
}
Sergiu Svinarciuc | CTO @ visely.io
- Was my reply helpful? Click Like to let me know!
- Was your question answered? Mark it as an Accepted Solution!
- To learn more about the awesome stuff we do head over to visely.io or our blog
0 Likes