Hi Daniel,
Thanks for posting a link.
You’re right – there is a background color on the <header> element which is showing through the transparent toggle bar. I am not sure why Divi is doing that when the main header is transparent – maybe there is a setting you can change?
If not, try this custom CSS:
@media (max-width: 980px) {
header {
background: transparent !important;
}
#et-top-navigation {
padding: 0 !important;
}
}
That should tidy up the mobile menu view.
I think you might also want to go to Mega Menu > Menu Themes > Mobile Menu and set the Toggle Bar Height to 65px, and maybe adjust the vertical positioning of the logo toggle block.
Regards,
Tom
Awesome – Thanks for your quick response and help Tom.
Working and looking great now. Appreciated!
Sorry, not sure if you can help here, but now on other pages, the background is white and I can not see the nav at all.
E.g. http://avery.psyborg.com.au/about/the-practice/
The background image should be pushed up behind the nav so the nav can be seen similar to the home page?
For some reason padding of 64px is being added pushing the image down 64px?
Hi Daniel,
I’m not sure why that padding is being added (it’s Divi that is adding it). I suspect there might be a Divi option which you could enable to stop that padding being added, but I’m not sure where that would be so you would need to contact Divi support to ask how to do it. Otherwise, that padding would need to be removed using some custom CSS.
Regards,
Tom
All resolved now with some CSS tweaks.
.et_pb_fullwidth_header {
margin-top: -64px !important;
}
Thank you for your help.