[Resolved] different container width for text on page

Home Forums Support [Resolved] different container width for text on page

Home Forums Support different container width for text on page

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #931105
    Katharina

    my container width is 1050px, can I set a narrower width for my text on my pages?

    Thanks
    kati

    #931130
    David
    Staff
    Customer Support
    #933152
    Katharina

    I did try it but whatever setting I use it contains the whole content.

    I would like to keep the background images still full width and only contain the content.

    #933166
    David
    Staff
    Customer Support

    With the Sections you have the option to set the Section to full width and the Inner Section contained which will respect the customizer > layout > container > container width.

    Do you want to narrow the inner container on specific sections?

    #934078
    Katharina

    with using the layout element
    If I choose Full width or Contained there is no difference. Everything in the section area is at the width I set at Content width below it.

    In this screenshot it’s set to Full width and 900px content width
    https://paste.pics/05b60d624d6a8c571454615f45800c14

    If I use content width in the customizer I get the issue with my testimonial section they are to narrow.
    https://paste.pics/4bbf1e308fd3323c4bb6a1b1c4f0b9db

    If the Layout Element doesn’t do the job I want, is there another way to have a different content width on chosen sections?

    Thanks
    Kati

    #934393
    David
    Staff
    Customer Support

    So for the pages where you’re using sections you need to set the Page Builder container to Full Width.

    Within the Sections themselves you have the inner section width which you should set to contained, this by default will respect the customizer container width.

    To change this for a specific section you will need to use CSS:

    1. Edit the Section on the Settings tab give it a CSS class e.g section-width-800
    2. Add this CSS:

    .section-width-800 .grid-container {
        max-width: 800px;
    }

    Then you just need to add the section-width-800 to any section you want to reduce its content width on.

    #935460
    Katharina

    Thanks David, that’s what I wanted

    #935551
    David
    Staff
    Customer Support
Viewing 8 posts - 1 through 8 (of 8 total)
  • You must be logged in to reply to this topic.