Why isn't my custom section aligning correctly with the rest of the page?

[Vapes4You]

Hi Community,

I have issues aligning my custom section to the rest of the page.

When I add content through the standard theme, every section is aligned with the wrapper of the page.

But when I add custom code, the width is the whole page.

How can I fix this? I tried copying code from existing sections, but nothing worked:

display: flex;
display: inline-flex;

etc.

Kind regards

V4Y

[Adenan]

Hi ^^ can you please send me the link? so I check this.

thank you! 🙂

[Vapes4You]

Hi Adenan,

sure here is the link: https://vapes4you.de/pages/nikotin-shot-rechner

Thank you very much in advance!

Kind regards

V4Y

[Uhrick]

hello, Vapes4you.

Can you please share the website link?

[Vapes4You]

Hi Uhrick,

sure here is the link: https://vapes4you.de/pages/nikotin-shot-rechner

Thank you very much in advance!

Kind regards

V4Y

[Uhrick]

go to wherever you are setting the css rules for the custom section and add these two properties:

max-width: 72.6rem;
margin: auto;

[Vapes4You]

Hi Uhrick,

thank you for your help.

The tables on the page are inside divs
<div class="function-container">

I added your css to those classes but it didn't change anything:

   .function-container {

border: 2px solid #000;

padding: 20px;

                max-width: 72.6rem;

                margin: auto;

}

[Uhrick · Accepted solution]

try replacing

max-width: 72.6rem;

                margin: auto;

with

max-width: 72.6rem !important;

                margin: auto !important;

and if that doesn't work, try pressing enter in a blank space and saving again. I've come to notice that sometimes shopify only updates visually until the previous save

[Vapes4You]

Hi Uhrick,

that did the trick! Thank you so much.

Kind regards

V4Y