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
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
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?
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
ok, that definitely worked! Thank you!
Hi biomeris,
Glad that we could help :)
Thanks for using Enfold and have a great day!
Best regards,
Nikko