Reduce product page margins - Symmetry theme

Shopify Discussion

Topic summary

A Shopify store owner using the Symmetry theme wants to reduce excessive white space (margins) on the left and right sides of product pages. An AI tool suggested looking for a full-width setting in product page settings, but the user couldn’t locate it.

Proposed Solution:
Another user recommended two approaches:

  1. Check theme customization settings under Online Store > Themes > Customize for product page layout/width options
  2. Add custom CSS code to the theme files targeting .product .container with max-width: 100% and zero padding

Current Status:
The CSS solution did not resolve the issue. The store owner provided their website link (zorii.in) and a screenshot showing the excessive margins, requesting further assistance to fix the problem. The discussion remains open with the issue unresolved.

Summarized with AI on November 1. AI used: claude-sonnet-4-5-20250929.
2

Hello @baidshryans

Adjusting the theme’s settings:

1 Go to your Shopify admin > Online Store > Themes > Customize.
2 Look for “Product pages” or a similar section in the theme editor. Sometimes themes have a setting to control the layout or width of the product page.

Custom CSS: If there’s no setting available, you can add custom CSS to reduce the margins. Here’s a CSS snippet that might help:

Go to Online Store > Themes > Actions > Edit Code.

In the Assets folder, find the theme.css or styles.css file and add the above code at the bottom.

.product .container {
    max-width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

If it doesn’t work, please give the link of your website and give screenshot, I will try to fix it.

Thank you