[Support request] Container Full-Width Isn’t Working

Home Forums Support Container Full-Width Isn’t Working

Viewing 15 posts - 1 through 15 (of 28 total)
  • Author
    Posts
  • #1518304
    Ravi Dixit

    Hello, GeneratePress team!

    When I am choosing full-width by going to Layout>Content Container (see this https://prnt.sc/vdlwsh) this is not working. Instead, it is hurting the default layout also. See this image https://prnt.sc/vdluwt

    The default layout of a post is https://prnt.sc/vdlvgi

    I have added a code to minimize the post container width to 800px, I guess that is causing the issue.

    Here is the code that I am using

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

    But I want to keep the default single post container as it is 800px. But full-width should work as it should be.

    Please help with this issue

    #1518392
    Leo
    Staff
    Customer Support

    Hi there,

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

    You can use the private information field.

    Let me know 🙂

    #1518573
    Ravi Dixit

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

    Please check

    #1518651
    David
    Staff
    Customer Support

    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?

    #1518657
    Ravi Dixit

    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.

    #1518696
    David
    Staff
    Customer Support

    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.

    #1518703
    Ravi Dixit

    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

    #1518706
    David
    Staff
    Customer Support

    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 ?

    #1518722
    Ravi Dixit

    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.

    #1518759
    David
    Staff
    Customer Support

    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;
    }
    #1519418
    Ravi Dixit

    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

    #1519454
    Leo
    Staff
    Customer Support

    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?

    #1520047
    Ravi Dixit

    Okay! I got it!

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

    #1520133
    Ravi Dixit

    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.

    #1520298
    David
    Staff
    Customer Support

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

Viewing 15 posts - 1 through 15 (of 28 total)
  • You must be logged in to reply to this topic.