[Resolved] Vertical alignment of floating menu

[Ketil]

Hi. Is there a way to vertically align a horizontal menu floating to the right of the logo, without also effecting the logo?
The only setting I found that effect this, is height of menu item, but perhaps there is another way without writing css?

[Leo]

Hi there,

Is this a live site with traffic?

If not then you could consider using GeneratePress 3.0 which is currently in beta.

If you switch over to Flexbox then the menu should be vertically aligned by default:
https://generatepress.com/generatepress-3-0-a-new-era/

If not we can come up with other solutions as well.

Let me know 🙂

[Ketil]

It’s going live october 1st

[Leo]

That case I’d recommend going with the 3.0 beta for now.

Let me know what your thought is.

[Ketil]

I’ll try it. I’ll deactivate current GP-version, then install the beta?

[Leo]

Yeah follow the steps here:
https://docs.generatepress.com/article/beta-testing/#generatepress-theme

[Ketil]

As it turns out, the site use a childtheme to hold some custom code, so I can’t use a different theme to solve this. Any quick fix will do 🙂

[Leo]

Try this:

@media (min-width: 769px) {
    .inside-header {
        display: flex;
        align-items: center;
    }
    .nav-float-right .inside-header .main-navigation {
       float: none !important;
       margin-left: auto;
    } 
}

[Ketil]

yes, that did it, thanks!

[Leo]

No problem 🙂

[Ketil]

Hi. A problem occured when adding this code, it “messed up” the header element for posts.
https://generatepress.com/forums/topic/element-css-problem/#post-1467127

[Ketil]

Solved.

[Leo]

Glad to hear 🙂

[Author]

Posts