Make header image flush with menu bar?
-
Hello!
First of all congratulations on such an amazing theme! I’ve been doing a lot of research and I have finally found the one I like. I will be purchasing some of the addons promptly!
I have one question though and I would love it if it is possible to be done.
I have a header image and would like to make it flush with the menu bar. So that there is no gap in between. Can that be done simply by editing the .css file?
Thanks in advance
-
Nevermind Tom! I just purchased the package and the option was in one of the plugins. Thanks again for a great affordable theme
Thanks so much for your purchase! Glad you figured it out 🙂
Can I ask where you found that option? I purchased the plugins as well.
Go to “Appearance > Customizer > Element Spacing”, and then remove the bottom padding from the header area.
Hope this helps 🙂
Tom,
Thank you for your fast reply. I don’t have an option for “Element Spacing” in the Customizer. At least none that I can find.
I just installed the theme–and purchased the add-on package, so I should have an updated version.
If you’re using GP Premium, go to “Appearance > GeneratePress” and enable the Spacing add-on.
If you’re using the Super Package, go to “Plugins” and activate “Generate Spacing”.
Fantastic. Thank you.
You’re welcome 🙂
Hi Tom, bravo for an excellent theme.
I, too, removed the bottom padding from the header area and it seems to work fine on my iMac, until I shrink the verticalness of the site (in Safari). Then the white space shows up below the background image for my header. Normal, I assume?
The bigger issue is when looking at my site on an iPhone (in Safari). The header image spans across the top just fine (in landscape and vertical mode of phone) but there is a large white gap before seeing the rest of the site.
My header image is 300×1100 pixels (same as container width)
My header width is set to 100% width
Header layout: Fluid/Full WidthHow can I remove the white gap so Nav bar and content cinches up to the header image?
Thanks so much, Marion
Can you possibly link me to your site so I can see the gap?
Thanks!
Here you go, Tom, still in draft form:
http://www.galleygourmet.bizTry setting the header background image size to “Cover”.
You can also set this only on mobile with this CSS:
@media all and (max-width:768px) { .site-header { background-size: cover; } }It worked!
Thanks Tom!You’re welcome 🙂
The topic ‘Make header image flush with menu bar?’ is closed to new replies.
