I added this code to make my mobile menu sticky and it works here: dev.mezzalunadesign.ca
.html_header_top.html_header_sticky #header {
position: fixed !important;
}
@media only screen and (max-width: 767px) {
.responsive #main {
padding-top: 0px !important;
}
}
But it is overlapping some content on all of the pages. How can I get it to push the content below the sticky header so that it can all be seen?
PS. I am still getting help re-positioning the call us and email us buttons to be next to each other instead of one on top of another so when that is fixed my header won’t be so tall.
Hey amerzib,
Please provide a link to the site in question so we can look into this further.
Best regards,
Jordan Shannon
The site was in the first line of my comment above but here it is again:
dev.mezzalunadesign.ca
Hi,
Can you link me to a page where its being overlapped? I’m not seeing that occurrence.
Best regards,
Jordan Shannon
Sorry the code controlling the sticky header got deleted for some reason but its back in there now
you can see it on a mobile device here:
dev.mezzalunadesign.ca
Hi,
I’m sorry but I can’t see the issue either. Please provide a screenshot on imgur or dropbox.
Best regards,
Ismael
Hi,
Please try adding this code to the Quick CSS section under Enfold > General Styling or to your child theme’s style.css file:
@media only screen and (max-width: 480px) {
.html_header_top.html_header_topbar_active.html_header_sticky #top #main {
padding-top: 109px!important;
}}
Best regards,
Yigit
That worked perfectly! Thanks