[Resolved] Header height with menu at the bottom

[Fabian]

Hi guys
I can set the header height with margin/padding in the customizer. But when i move the menu to the bottom of the header, the header expands to the bottom and i cant make the header thinner. Same thin with the logo.

The header should look like this. I hope you can understand what i mean.
—————————————————————
LOGOLOGO
LOGOLOGO
LOGOLOGO
LOGOLOGO | HOME | SITE1 | SITE2 | SITE3 | SITE4
—————————————————————

Another question is, is it possible to set the off canvas menu to the push mode. i mean that the canvas menu does not overlay over the website and pushes the site to the side. Also im interested how i can remove the overlay over the site when the canvas menu is opened.
Thanky you for this nice theme and i’m sorry for my bad english.

[David]

Hi there,

1. tricky one – try adding this CSS:

@media (min-width: 769px) {
    .inside-header {
        display: flex;
        align-items: flex-end;
    }
    .main-navigation .main-nav > ul > li a {
        line-height: 2;
        padding-bottom: 5px;
        padding-top: 40px;
    }
    .site-logo {
        padding-bottom: 10px
    }
}

2. This topic covers how to do something similar:

https://generatepress.com/forums/topic/slide-in-menu-that-moves-whole-site-to-the-left/#post-1130396

[Fabian]

Hi David

Thank you very much for your help! I appreciate it. That worked for me.

[Fabian]

Just one more thing:
When the search bar is opened on desktop. it moves into the website content.

[David]

The search bar gets it height from the Menu Item height set in the Customizer > Layout > Primary Navigation – so try reducing that ….

[Fabian]

Thank you again David!

[David]

You’re welcome

[Author]

Posts