Hi guys! I have the boxed layout set on my site (max width 1300px) and I was wondering if you could help me figure out how to make it so that certain pages are full width and not boxed.
This css clip works to make it full width and not boxed on laptops:
@media only screen and (max-width: 3000px) and (min-width: 768px) {
.responsive body.boxed#top, .responsive.html_boxed.html_header_sticky #top #header, .responsive.html_boxed.html_header_transparency #top #header {
max-width: 100% !important;}
}
I tried modifying this clip so that I could target certain pages instead but it didn’t work:
.page-id-67 .responsive body.boxed#top, .responsive.html_boxed.html_header_sticky #top #header, .responsive.html_boxed.html_header_transparency #top #header {
max-width: 100% !important;}
}
Thanks so much guys, your help is much appreciated!
Hey peanuttario,
Please try adding this code to the Quick CSS section under Enfold > General Styling or to your child themes style.css file:
body#top.page-id-67, .page-id-67 #header {
max-width: 100%!important;
width: 100%!important;
}
Best regards,
Yigit
It worked fantastically! Thank you so much Yigit!