Adding left and right margin to entire website

Shopify Discussion

Topic summary

A user sought help adding 200px margins to both sides of their Shopify store (greerchicago.com) using the Stretch theme.

Solutions Provided:

Two approaches were offered:

  1. CSS modification - Target the .page-width class with max-width: calc(100% - 400px) plus 200px left/right margins. A media query version was suggested for desktop-only application (min-width: 769px).

  2. Custom code injection - Add CSS via a <style> tag in theme.liquid file, placed above the </body> tag. This solution included a visual result screenshot.

Outcome:

The issue was resolved successfully. The user confirmed the solution worked and thanked the contributors.

Summarized with AI on October 30. AI used: claude-sonnet-4-5-20250929.
1

My website is greerchicago.com and I’m using the Stretch theme. I’m interested in adding a 200px margin to the left and right sides of my site but can’t work out how to do it. Any insight would be appreciated.

Thank you.

1 Like
2

@GREERChicago

Locate css and try this,

.page-width {
  max-width: calc(100% - 400px);
  margin-left: 200px;
  margin-right: 200px;
}

if desktop-only use

@media (min-width: 769px) {
  .page-width {
    max-width: calc(100% - 400px);
    margin-left: 200px;
    margin-right: 200px;
  }
}

hope best.

1 Like
3

Hey @GREERChicago

Follow these Steps:

  1. Go to Online Store

  2. Edit Code

  3. Find theme.liquid file

  4. Add the following code in the bottom of the file above tag

RESULT:

Moeed_0-1742919832527.png
Moeed_0-1742919832527.png1901×918 303 KB

If I managed to help you then, don’t forget to Like it and Mark it as Solution!

Best Regards,
Moeed

1 Like
4

Perfect! Thank you so much for your help.

1 Like
5

Thank you!

6

Thank you for your reply. I’m glad to hear that the solution worked well for you. If you require any more help, please don’t hesitate to reach out. If you find this information useful, a Like would be greatly appreciated.

1 Like