Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #1429756

    Hi there,

    I want my entire website including all content to have the same width. In General Layout I set Layout to Boxed and Maximum Container Width = 1296px. Is there a global setting I can change to make all content (background image at the top of each page, color sections, headers and footers) all one width i.e., 1296px? If not, please suggest the most efficient way to set one width for content across the website.

    Please see link below width screenshot with illustration of what I’m trying to do. For reference, see second link below with website width/layout I’m trying to emulate. I’m customizing the Enfold law firm demo – https://kriesi.at/themes/enfold-law/practice-areas/

    #1429775

    Hi WorldinColor,

    The only global option we have to change the width is the one you mentioned which is Maximum Container Width in General Layout.
    However, I think what you want is a boxed layout, which you can set in General Layout > Layout (tab) > Stretched Or Boxed Layout, then set this to Boxed layout.
    Hope it helps.

    Best regards,
    Nikko

    #1429827

    Hi Nikko, thanks for your response!
    As previously stated, I already set General Layout to Boxed Layout and set a Maximum Container Width. Perhaps I didn’t clearly articulate the problem. After setting to Boxed+ Max Width, I expected content (color sections, headers and footers) to align with the background/header picture at the top of the page. But there seem to be margins to the right and left of my content sections. How can I remove those margins (?) so that all content aligns with the image at the top of each page? Please see the link 1 in the original post which illustrates the problem and link 2 which is the overall look I want to achieve.

    #1429833

    After research I think I’ve figured out the problem. The problem isn’t the need to change layout from stretched to Boxed. The problem is the the FullWidth Area is wider than my content (in General layout –> I have Maximum Container Width = 1296px). I want to keep the Image + page title configuration that’s in the FullWidth area BUT don’t want “Image + page title” to be wider than the content. How can I reduce the width of the FullWidth Area so it matches the content width? If there’s no way to reduce the width of the Fullwidth area, can it be removed? If so, how can I retain the “Image + page title” setup which can be applied to all the pages on my site?

    According to this documentation – https://kriesi.at/documentation/enfold/header/#header-width “By default, the width of the content inside the header is same as the width of the container which is set in Enfold > General Layout > Dimensions > Maximum Container width” but my header seems to be wider than the Maximum width I specified.

    #1429844

    Hi WorldinColor,

    I think we can use Custom CSS Class for that, please do the following steps.
    1. Put the image and title/content inside a Color Section, then edit the Color Section, go to Advanced > Developer Settings > put my-content-section in the Custom CSS Class field.
    2. Go to Enfold > General Styling > Quick CSS, then add this CSS code:

    .my-content-section .container {
        max-width: 900px;
    }

    Just adjust the width as you see fit.
    If you need to re-use it, just repeat step 1 only.

    Best regards,
    Nikko

    #1433317

    This is now working thank you. You can close the ticket.

Viewing 6 posts - 1 through 6 (of 6 total)
  • The topic ‘Boxed Layout with one width for all content’ is closed to new replies.