Custom Page Is Too Narrow on Desktop — How to Make It Full Width?

Shopify Discussion
, ,

Topic summary

A user is attempting to make a custom Shopify page (/pages/nuestra-esencia) display at full width on desktop but encounters persistent layout constraints despite CSS overrides.

Attempted solutions:

  • Modified theme.liquid and base.css
  • Applied CSS targeting .t4s-content-position.t4s-container and .page-width-wide with max-width: 100% !important and width: 100% !important
  • None of these changes produced visible results

Additional context:

  • The issue occurs across two different themes (Atelier and Vessel)
  • Browser inspect tool is not functioning, complicating troubleshooting

Seeking guidance on:

  • Effective methods to force full-width layout for specific pages or globally
  • Alternative approaches when standard CSS overrides fail

The discussion remains open with no solutions or responses yet provided.

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

Hi everyone,

I’m trying to make my custom page (/pages/nuestra-esencia) full width on desktop, but it’s stuck at a narrow layout, even after trying to override with custom CSS. I’ve edited theme.liquid and base.css, and tried applying styles like:
.t4s-content-position.t4s-container,
.page-width-wide {
max-width: 100% !important;
width: 100% !important;
}
Still no change. Inspect doesn’t open on my browser either.

What’s the best way to force full-width for specific page or all pages? I am using 2 themes currently: atelier and vessel and with both i am facing the same problem.