[Resolved] Menu next to logo

[Jan]

Hello !
We use the generate press theme and the addons, which are great !

There’s just one thing I can’t find,
I’d want the menu to be next to the logo.
I’ve tried several answers that I’ve found on this forum, but still no luck.
( for example , https://generatepress.com/forums/topic/logo-and-menu-float-left-problem/, this made my menu appear twice )

We already have topbar with left and right floating which works perfectly.
We just need the menu to move to the left, next to the logo .
http://www.floorsonline.be

Could you please help me figure this one out ? 🙂

[Tom]

Hi there,

Give this CSS a try:

.nav-float-right .inside-header .main-navigation {
    float: none;
    display: inline-block;
    vertical-align: middle;
}

Let me know 🙂

[Jan]

That works perfect ! Thank you !!! 🙂
I just have one little question,
When we open our site on the ipad, it shows a mobile menu when the screen is lying verticaly (? If you understand this 🙂 ) which is perfect,
but when you view the website when the ipad is lying horizontal, it shows the normal menu.
However, the menu is placed under the logo, because it doens’t fit the screen.
Is there a way to change the padding between the menu items, resize the logo or to show the sticky menu instead on horizontal mobile view ?

[dasigna]

… menu looks just fine for me on landscape view on ipad. ??

[Tom]

Landscape on tablets use the desktop breakpoint, so what you could do is add a media query to reduce the font size of your menu items at your needed breakpoint.

For example:

@media (max-width: 1000px) {
    .main-navigation .main-nav li a {
        font-size: 14px;
    }
}

[Jan]

Thank you so much !

[Tom]

You’re welcome 🙂

[tsecher]

I use both main and secondary menu under the logo and the secondary menu is the one I have left alligned. How do I refer to the secondary menu in the code?

[Tom]

Any chance you can start a new topic with what you’re wanting to do?

Thanks! 🙂

[tsecher]

Already did – sorry 😉

[generator]

Hello,
I also wanted the Logo left and Navigation right.

But your code from top of this topic doesn’t work for me (it stays above the navigation).
Actually “nav” is outside of “header” where logo is?!:

<header>

</header>
<nav>

</nav>

This doens’t work with that css, does it?!
I have the menu as “primary menu”
My version is 1.6.2

(I admit, before that I played around with making it a split menu…but I already deleted that css…now I’m not sure if I had done some script stuff somewhere?(I believe the split thing works without, so I didn’t?!).)

[Leo]

Hi there,

Any chance you can open a new topic and link us to the page in question?

Thanks!

[Author]

Posts