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

    Hi,
    I’ve been using enfold with ease and success, there is only one thing that I can’t manage:
    (screenshot and mockup here https://ibb.co/L0nZKtr )
    I would like the content of the website to be paginated, while the backround color of header and footer should be stretched to the 100% of the page. Could you pont me to the CSS that can achieve that?

    Thanks in advance

    • This topic was modified 5 years, 8 months ago by biomeris.
    #1080407

    Hey biomeris,

    Can you try adding this css code in Quick CSS, located in Enfold > General Styling:

    .responsive .boxed#top, .responsive.html_boxed.html_header_sticky #header, 
    .responsive.html_boxed.html_header_transparency #header {
        width: 100%;
        max-width: 100%;
    }

    Best regards,
    Nikko

    #1080410

    Hi Nikko, Thanks for your input,
    I’ve tried just now; it looks like

     .responsive .boxed#top, .responsive.html_boxed.html_header_sticky #header, .responsive.html_boxed.html_header_transparency #header {
        width: 1310px;
        max-width: 90%;
    }

    is preventing that CSS to stick, so I tried flagging your code as !important, like this

    .responsive .boxed#top, .responsive.html_boxed.html_header_sticky #header, 
    .responsive.html_boxed.html_header_transparency #header {
        width: 100%!important;
        max-width: 100%!important;
    }

    but now the menu and logo go flying at the opposite sides of the page, no matter how wide it gets.
    What to do?

    • This reply was modified 5 years, 8 months ago by biomeris.
    #1081289

    Hi biomeris,

    I see, try using this instead:

    .responsive .boxed#top, 
    .responsive.html_boxed.html_header_sticky #header, 
    .responsive.html_boxed.html_header_transparency #header {
        width: 100% !important;
        max-width: 100% !important;
    }
    
    .responsive.html_boxed.html_header_sticky #header .container, 
    .responsive.html_boxed.html_header_transparency #header .container {
        width: 90%;
        max-width: 1310px;
    }

    Best regards,
    Nikko

    #1083518

    ok, that definitely worked! Thank you!

    #1083852

    Hi biomeris,

    Glad that we could help :)
    Thanks for using Enfold and have a great day!

    Best regards,
    Nikko

Viewing 6 posts - 1 through 6 (of 6 total)
  • The topic ‘[solved] boxed content with stretched header and footer background’ is closed to new replies.