Page default template is narrow

Topic summary

A user is experiencing an issue where the default page template in the Empire theme appears too narrow on desktop (mobile display is fine). They’ve attempted to add custom CSS without success.

Proposed Solutions:

Two community members provided similar CSS-based fixes:

  • Navigate to: Online Store → Edit Code → theme.css
  • Add the following code at the end of the file:
.page-content {
    max-width: 1000px !important;
}

One responder suggested using 1400px instead of 1000px for a wider layout, and included a visual guide showing where to locate the theme.css file in the Shopify admin.

Status: Solutions provided; awaiting confirmation from the original poster on whether the fix resolved the issue.

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

Hoping you can help, i cannot figure out how to adjust the width of default page template within empire theme. It is narrow on desktop, fine on mobile. I have tried adding custom CSS code but it says its not recognised.

For example

https://ultimatepartyshop.com/pages/contact-us

Any ideas, no idea why shopify have done this!!

Thanks in advance.

go to your online store → edit code → theme.css file and paste this code there in the end of file

.page-content {
    max-width: 1000px !important;
}

Hey @JoClingan ,

Please paste this code in the end of theme.css file.

.page-content{
  max-width: 1400px !important;
}
.page-content {
    max-width: 1400px !important;
}

Here is how you can find base.css file.

Go to Shopify Admin > Online Store > Edit Code > base.css

Results:

Let me know if you need further help.

Thanks