[Resolved] Two Third / One Third Layout

Home Forums Support [Resolved] Two Third / One Third Layout

Home Forums Support Two Third / One Third Layout

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #2052878
    Paul

    Hi,

    I’ve asked this question before, but when I’ve checked the previous answer, I still see the same issue:
    https://generatepress.com/forums/topic/two-third-one-third-layout/

    I’d like the content area to be the same width as 66% grid column, and the sidebar to be the same width as a 33% grid column.
    Using the CSS provided by Leo, you can see on the linked page the widths are different – content area @ 66% is narrower than a grid column, and the sidebar @ 33% is wider than a grid column. How can I correct this?

    Thanks,
    Paul.

    #2053218
    Ying
    Staff
    Customer Support

    Hi Paul,

    Not sure I fully follow your question, are you trying to make the layout like this?
    https://www.screencast.com/t/TdW7tw4Ge

    If so, go to customizer > layout > container, set content padding to 0.

    Then add this CSS to remove the margin on content:

    .one-container.right-sidebar .site-main {
        margin-right: 0;
    }
    #2053328
    Paul

    Hi Ying,

    I’d like the content area to be exactly the same width as the 66% grid column below it. And the sidebar to be exactly the same width as the 33% grid column below that.

    I’m not clear why the CSS provided by Leo doesn’t result in the correct widths since the percentage values are the same, so the 20px gap.

    I can’t set the content padding to zero in this instance.

    #2053333
    Ying
    Staff
    Customer Support

    Check the screenshot below, the sidebar widget area is 1/3 and the content area is 2/3.

    The CSS is working just fine:
    https://www.screencast.com/t/CdF97XuhGxw

    The 3 red boxes are exact same size.

    #2053338
    Paul

    In the screenshot the sidebar is 373px, same as I see. 1/3 grid column below is 360px.
    2/3 grid column is 739px, content area is 726px.

    #2053340
    Ying
    Staff
    Customer Support
    #2053968
    Paul

    Increasing/decreasing the percentage values in CSS seems to resolve this.

    Thanks for your help.

    #2054762
    Ying
    Staff
    Customer Support

    No problem 🙂

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