How to make Post containers and Page containers same width?

Hi there,

You have 2 blocks of CSS that are setting the post container width:
https://www.screencast.com/t/YNMi3JNl
https://www.screencast.com/t/YlcXcEwCQE

I would recommend looking for your CSS first when you encounter weird issues like this.

Okay thanks, I have combined them...

Can you provide me with the same CSS for Pages also?

Thanks...

The first time, I create CSS myself:


#page .inside-article {
max-width: 900px;
margin: 0 auto;
box-shadow: 0px 0px 30px 0px rgba(0,0,0,0.13);
}


But it is making all pages 900px width, I don't want to make those pages for which I set full width.

Please let me know what is wrong in this CSS.

Instead of using CSS to set the container width, would you consider using the built-in option instead?
https://docs.generatepress.com/article/layout-element-overview/#content-1

Let me know :)

I can't see any option there to set a custom width for specific pages.

I am seeing something like this: https://docs.generatepress.com/wp-content/uploads/2017/03/page_builder_container_meta.png

Hi there,

go to the Appearance > Elements and create a new Layout Element - you will see the options available there.

Hello, David!

Sorry for the late reply.

I tried and as suggested, It is working fine also. But it is making all my page 900px width.

I only want to show some pages except the pages I set full-width container for...

I know I can do it by adding page rules manually for each page... But it will be tricky and I will have to add the same for new pages I will create in future.

Please help...

What if we try this CSS?

body.page:not(.full-width-content) .site.grid-container {
    max-width: 900px;
}

This will set the static page that aren't using full width container setting to 900px for container width.

If this logic still doesn't work you, then you will need to use the exclusion rule in the layout element.

It worked, Thanks LEO!

Please help me to show left and right shadow as same as I am showing for a single Post container.

Thanks for the help...

It should be:

body.page:not(.full-width-content) .site .inside-article {
    box-shadow: 0 0 10px rgba(0,0,0,0.1);
}