Container Full-Width Isn't Working

Hi there,

Any chance you can link us to the site in question?

You can use the private information field.

Let me know :)

I have shared the URL of the site in the private fields.

Please check

Hi there,

you can't have a full width container and then use CSS to limit it to 800px wide.
What exactly are you trying to fix / achieve?

I want to design a post with the Elementor but when making it full-width, it is not working!

Even when I am choosing Elementor Full Width template.

Thats because of this CSS:

.single .inside-article, .comments-area {
    max-width: 800px;
    margin: 0 auto;
    box-shadow: 0px 0px 30px 0px rgba(0,0,0,0.13);
}

You're setting the content max-width: 800px;
That will need to be removed for the page to be displayed full width.

Okay, I already know this...

Is there any other way I can keep the single post container width same as it is now... And make the full-width work like normal.

Please let me know

Sorry i am confused. How can it be displayed at 800px and be full width at the same time ?

Are you wanting to make Elementor content stretch the width of the 800px container ie. no padding ?

Sorry for the confusion...

I want the normal posts which set to default in Layout>Container to have the 800px...

And when I choose the full-width in Layout>Container it should have full width.

Change your CSS to:

.single:not(.full-width-content) .inside-article, .single:not(.full-width-content) .comments-area {
    max-width: 800px;
    margin: 0 auto;
    box-shadow: 0px 0px 30px 0px rgba(0,0,0,0.13);
}

body:not(.full-width-content) .inside-article {
    border-radius: 10px;
}

Thanks, David!

It worked as I expected, Thanks for your help.

I don't want to work this particular CSS code when I choose Full-Width

body:not(.full-width-content) .inside-article {
    border-radius: 10px;
}

And also I want to remove the author meta from the full-width template. like by Ravi Dixit

I don’t want to work this particular CSS code when I choose Full-Width

That should already be the case as the selector includes :not(.full-width-content)

Can you link me to the specific page in question?

Okay! I got it!

But how can I remove author name from the full-width pages completely?

Hello, David!

The code you provided above is working excellent but all the comment area is also full-width now, which is good.

But the items added in the bottom of the pages like Facebook section, comment box, author bio etc also stretched. I don't want this...

I want them to look normal as on other pages... But the page should be full-width, is there any way?

We can also make the comment area 800px(like other pages) and make the background white if there is no other way, but it should be on the full-width pages only, should not affect other pages.

Where can i see a Post with the Full width option enabled ?