Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • March 15, 2019 at 4:11 pm #1079174
    biomeris

    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, 9 months ago by biomeris.
    March 19, 2019 at 5:35 pm #1080407
    Nikko

    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

    March 19, 2019 at 5:54 pm #1080410
    biomeris

    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, 9 months ago by biomeris.
    March 21, 2019 at 9:57 am #1081289
    Nikko

    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

    March 27, 2019 at 11:45 am #1083518
    biomeris

    ok, that definitely worked! Thank you!

    March 28, 2019 at 1:34 am #1083852
    Nikko

    Hi biomeris,

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

    Best regards,
    Nikko

  • Author
    Posts
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.