How can I adjust the width of a Div in CSS?

[califluffco]

Hi everyone! I’m working on adding in my reviews to my site (so exciting), but it’s defaulted to be like oddly wide full width across the page and it just looks odd. I’ve tried a variety of ways to modify the width but nothing is working. Any advice?

You can view on site here: https://califluffco.com/collections/for-mom/products/dog-mom-tank

Code is at the bottom.

{% comment %}
  The contents of the product.liquid template can be found in /sections/product-template.liquid
{% endcomment %}

{% section 'product-template' %}
{% section 'product-recommendations' %}

{% if collection %}
  
    
      {% include 'icon-arrow-left' %}
      {{ 'products.product.back_to_collection' | t: title: collection.title }}
    
  

{% endif %}

{% assign current_variant = product.selected_or_first_available_variant %}

{{ product.metafields.spr.reviews }}

[system]

Hello @califluffco

Try to update the bottom code and add a class shown below.

{{ product.metafields.spr.reviews }}

[califluffco]

Hey @Anonymous

Sorry what class do I add? It looks like the code you sent is the same as what’s in there so wanted to double check. I tried adding class in prior but i’m sure I was doing it wrong. If you can show an example that would be helpful. thanks!

[system]

Hello @califluffco ,

Sorry, my bad. I have updated the code and adding this code will make your review section like the screenshot below.

{{ product.metafields.spr.reviews }}

[califluffco]

@Anonymous ok so that helped, but it looks like it’s super far left. Any suggestions?

See in action here: https://califluffco.com/collections/fall/products/big-foot-small-paws-1

[system]

@califluffco Please add this CSS.

#shopify-product-reviews{
margin: 1em auto !important;
}

[califluffco]

@Anonymous yes that worked - thanks so much!!