Remove padding/margin for customer reviews

Ziado4
Tourist
13 0 3

Hello,

When a second review occurs on my page, the latest review gets a huge margin/padding compared to the first. How can I remove this?

Ziado4_0-1613845501137.png

Thanks!

Ziad G

0 Likes

Do this to fix it in 20 seconds:

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

 

.spr-review{
    padding-bottom: 0px !important;
}

#shopify-product-reviews{
    position: relative;
    margin-bottom: -40px;
}

@media (max-width: 767px){
    #shopify-product-reviews{
    position: relative;
    margin-bottom: -10px;
}
}

 


You can adjust the values as per your wish. Either negative or positive numbers will work.

-40px = bottom spacing of the entire reviews section on desktop
-10px = bottom spacing of the entire reviews section on mobile

Please let me know whether it works.

Kind regards,
Diego

◦ Problem Solved? ✔️ Please click on Accept as Solution and like.
◦ Using a free theme? Improve it with copy/paste code snippets clicking here.
◦ Looking to hire an experienced developer? Same day response: ezfycode@gmail.com.
Ziado4
Tourist
13 0 3

Hi Diego,

Thank you so much, this almost solves my issue! However, I am trying to change the 0px and the -40px to decrease the spacing even more (I am on desktop), but it is not yielding any effects (the spacing stays the same). Any idea why?

Also, is there a way to reduce the spacing between the reviewer name and their review text?

One more time thank you so much!

Best,

Ziad

0 Likes