How to Increase Width of Legal / Policy Pages? The container is very narrow

Technical Q&A

Topic summary

Users are seeking to expand the narrow width of Shopify policy and legal pages to utilize more screen space.

Primary Solution:

  • Add CSS code to the theme file (theme.css.liquid or base.css depending on theme):
.shopify-policy__container {
  max-width: 100% !important;
}
  • Multiple users confirmed this solution works for desktop versions
  • The !important declaration appears critical for overriding default styles

Outstanding Issues:

  • Mobile version width remains unresolved despite the desktop fix working
  • Solution doesn’t work for all themes/configurations (some users report no effect)
  • One case involves a two-column layout (6x6 grid) that prevents the CSS from working as expected

Additional Considerations:

  • Code placement varies by theme: Dawn theme users need to paste into base.css instead of theme.css.liquid
  • Some users adjusted the percentage value (e.g., 60%) to better match their site design
  • Creating custom page templates matching policy page styling remains an open question
Summarized with AI on October 28. AI used: claude-sonnet-4-5-20250929.
1

Hello, I have reviewed 2 other posts about this topic but didn’t find a solution. Please help! I would like to expand the width of the policy / legal pages. They are very narrow. I am not using a shopify theme. All my css is in theme.css.liquid. Below is a picture of what my page looks like. Here is the html that is driving that section. Any idea of what I can put into the css file that will fix this so the page content is at 100%?

  • Home
  • Shipping policy
1 Like
2

Hello @kchart ,

share store link for a better understanding of the problem.

3

Thanks it’s https://eshop.contecamericas.com/policies/shipping-policy

4

@kchart

  1. Go to Online Store->Theme->Edit code
  2. Asset->theme.scss->paste below code at bottom of file

.shopify-policy__container {
max-width: 100% !important;
}

Want to modify or custom changes on store hire me.
If helpful then please Like and Accept Solution.
Email: wahabahmadghori@gmail.com

13 Likes
5

@Wahab_Ahmad

Thank you very much. I added this to my theme.css.liquid file and it worked! Strange because I thought I had already tried that but there must have been a small error in my original code. Thank you very much for your help!

6

Thank you for the instant fix. This worked!!! :slight_smile:

1 Like
7

Hi, I would like to add more policies and want to create maybe a new page template that matches the margins and title spacing of the policy templates already provided. How do I do this?

1 Like
8

Thank you for your help, @Wahab_Ahmad ,

How is it possible to expand the width of the legal pages in mobile version of our sites? it worked for the desktop version but I would like to customize the mobile version too.

Thank you

1 Like
9

Good question and I am still looking for this solution for my mobile version too.

10

Perfect worked out like a charm thanks a lot

11

I guess its the !important code that makes it work

12

Hi @Wahab_Ahmad I am also facing the same issue, tried your code but it is not working out - could you please guide?

Store URL:

https://fmhglobalstore.com/policies/privacy-policy

13

It’s split into two columns 6 x 6 this is why it will not work is there a specific reason why make two columns or its in the default of your theme ?

14

I am using a dawn theme, and that may be why I had to paste the code into <base.css>.

It took a while for me to figure out where to paste it, but the hard part is obviously the code itself.

I played a little with the numbers too and decided that, “60%” to fit better with my banner.

Thank you very much.

15

Hey, @maxikaya

I understand you are looking for a coding solution to adjust the padding of your legal page. However, I’m confident one of our Shopify experts would be able to accomplish this at a reasonable price.

Just wanted to share this as an option in case you are unable to find a coding solution in your thread.

If there is anything else I can help you with, please let me know.

16

Hello, I also have the same question. I tried the code
.shopify-policy__container {
max-width: 100% !important;
}

But this code is not working at all for my page.

Here is my website Impressum – palvago

Could someone help me?

Thanks,

Karen