Woocommerce review stars too close together

  • Resolved steve_williams_wp

    (@steve_williams_wp)


    2 years, 5 months ago

    Hello

    On a product page, the review stars are too close together on both desktop and mobile devices so when someone clicks on 5 stars, it’s registering as four.

    I did find a piece of code as below and added it to Custom CSS but it didn’t work.

    .wcpr-overall-rating-right .wcpr-overall-rating-right-star .star-rating {
    font-size: 24px;
}
.wcpr-col-star .star-rating:before, .wcpr-col-star .star-rating span:before, .wcpr-overall-rating-right-star .star-rating:before, .wcpr-overall-rating-right-star .star-rating span:before {
    left: 0;
    content: "\e606\e606\e606\e606\e606";
}
.wcpr-content .review-content-container .star-rating:before, .wcpr-stars-count .star-rating:before, .wcpr-modal-wrap .wcpr-modal-content .star-rating:before {
    left: 0;
    content: "\e606\e606\e606\e606\e606";
    font-size: 24px;
    letter-spacing: -5px;
}
.wcpr-modal-light-box .wcpr-modal-light-box-wrapper .wcpr-modal-wrap .wcpr-modal-content .star-rating, .wcpr-grid .wcpr-grid-item .wcpr-content .review-content-container .star-rating {
    font-size: 18px;
}

    Any other suggestions or solutions would be much appreciated.

    Thank you

    The page I need help with: [log in to see the link]

Viewing 1 replies (of 1 total)
  • Saif

    (@babylon1999)

    Hello @steve_williams_wp,

    I checked your site and the starts are not rendering correctly.


    Link to image: https://i.imgur.com/uf5MDhX.png

    Before jumping to any conclusions, can you please remove any CSS snippets you added to solve this?

    Could you also share a copy of your site’s System Status? You can find it via WooCommerce > Status. Select “Get system report” and then “Copy for support”.? Once you’ve done that, paste it here in your response.

    Look forward to hearing back from you.

Viewing 1 replies (of 1 total)
  • The topic ‘Woocommerce review stars too close together’ is closed to new replies.