How to adjust the review box size in Debut theme

[Santoe]

Hi Shopify Community,

Is there anyone who can help me out resolve this problem?

I'd like to adjust the size of the review box and can't seem to find where or how. I'm using the 'Product Reviews' app from Shopify. It now stretches horizontal all over the length of the browser but I'd like it to be way smaller, please see below. 

It's the same on the mobile version, but I don't mind that because it's an small device. So you don't have the enormous empty space. I am using the Debut theme. If there is anymore information needed from me, please let me know so I can provide. Looking forward to an solution!

Thank you so much Shopify Community!

[suyash1]

@Santoe - can you please share product page with this review tab? and password to view page, if any

[Santoe]

Thank you so much for replying @suyash1, this is the link to one of my products: https://jijverdienteensticker.nl/collections/frontpage/products/beloningsstickers-voor-volwassenen

It's this size underneath every product and I like to adjust it like the example above.

[suyash1]

add following css to the end of theme.scss file and check

#shopify-product-reviews{ width: 60%; margin: 0 auto;}

[Santoe]

@suyash1 I followed the instructions and it kinda works, but is now sticking to the left side of the browser. Is there a way to get it in the middle? Please see below.

[suyash1 · Accepted solution]

make that margin:0 auto ; as margin: 0 auto !important; it should work

[Santoe]

@suyash1 tried that, but it doesn't work? Or I did it incorrectly as I have little to no knowledge of coding. 

this is how my website looks now (I did create a back-up, no worries):

[suyash1]

@Santoe - just remove that semicolon ( ; ) after auto and it will work absolutely fine.

[Santoe]

You're absolutely right! Thank you so much for your help, could've had saved me days of headaches if I reached out earlier to the community. You just made my day! Works perfect.

I have on last question where I would like to use your expertise, if you don't mind. How can I get more room between the buttons and the review box? Please see below.

[suyash1]

@Santoe 

add one more line of css - margin-top: 30px !important;  so entire css becomes

#shopify-product-reviews { width: 60%; margin: 0px auto !important; margin-top: 30px !important;}

this should work and adjust numbers as per need