[Resolved] Navigations on different rows and both to ”Float right”

[Kirmo]

Hi,

I have had some difficulties to launch secondary navigation (with language links + search bar) via GP-customize panels. Now it is published there by hook ”before_header_content”, but is there some tricks how to make it flow nicely right on the top of the Primary navigation? thanks if you can find some solutions here.

[David]

Hi there,

try adding this CSS:

#secondary-navigation {
    order: 10;
    margin: unset;
}
@media(max-width: 1150px) {
    .has-inline-mobile-toggle #site-navigation {
        order: 20;
    }
}

[Kirmo]

Hi, thanks. It reordered (primary & secondary) navigations now but did not put it (secondary) on the top of the primary (menu+). I wonder is there some way to do it?

Also (sorry another point here) I would like the secondary navigation to stay always in ”desktop mode” and not to be organised under ”mobile toggle” even in narrower windows, is there some way to keep it so?

[Ying]

Hi Kirmo,

Can you try this CSS:

@media(max-width: 1150px) {
button.menu-toggle.secondary-menu-toggle {
    display: none;
}
.secondary-navigation .main-nav ul {
    display: flex !important;
}
}
@media(min-width: 1151px) {
nav#secondary-navigation {
    position: absolute;
    top: 15px;
    right: 30px;
}
nav#site-navigation {
    margin-top: 30px;
}
}

[Kirmo]

Nice, seems to work, thank you!

[Ying]

No problem 🙂

[Author]

Posts