Hello, I can’t seem to figure out how to make the header area full transparent.
If you take a look at http://techwizdesign.com/cap/home you will see the top menu area doesn’t seem to be transparent. If you scroll down a bit, you will see it turns transparent for a second, then turns back to that white color.
On this homepage, I do indeed have the Layout setting for “Activate Header Transparency” set to transparent header, but something else is overwriting it. Clicked through and checked options in General Styling and Header layout from the Enfold settings page but can’t seem to figure it out. Any help would be appreciated.
Hey mand4mac3!
Are you using Jetpacks custom css module and have you added these rules to it:
#header_main .container, .main_menu ul:first-child > li a{ height:120px; line-height: 120px; }
.html_header_top.html_header_sticky #top #wrap_all #main{ padding-top:120px; }
Regards,
Devin
The Jetpack plugin was installed, but is now disabled. I did have some custom css added, but is now removed.
I’m pretty sure I saw it transparent when It was first setup, but something a color may have got set somewhere which is causing that. Not too sure though
Hey!
Thank you for the update.
First of all, please empty the plugin cache then add this on Quick CSS or custom.css just to make sure that there are no padding on top of the main container:
.html_header_top.html_header_sticky #top #wrap_all #main {
padding-top: 0;
}
Cheers!
Ismael
Thanks for the help. That didn’t help but, but I ended up finding out what it was. Not sure if this is a minor bug or not
In the Enfold > Header Layout there is an option for Header Size. Before I had it set to use Custom Pixel Value to make use of a larger logo area. This worked for the logo, but it stopped the transparency from working properly. Right now I have it set to Large, and the transparency is functioning