[Resolved] Move top-bar inside site-header

[Bas]

Hi,

Is it possible to move the content of the top-bar (as seen on my website) to the top right of the site-header?
This will save me another 30 pixels of valuable space.

Thanks in advance 🙂

GeneratePress 2.2.2

GP Premium 1.7.8

[Leo]

Hi there,

I believe using header widget area might be the easier route.

Can you try that first and let me have a look?

Thanks!

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Bas]

I moved the navigation menu to the header widget area as you told.
Now the items are spaced vertically.

How can I make them space horizontally?

[David]

Hi there,

this CSS:

.header-widget {
    max-width: 80% !important;
}
#menu-header-menu {
    display: flex;
    margin-top: 1em;
}
#menu-header-menu > li {
    margin-left: 2em;
}

Or alternatively you could use the Secondary Navigation and set it to float right. It will generate a separate mobile menu though.

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Bas]

Hi David,

Works like a charm.
Thanks for the fast reply.

Have a nice day!

[David]

You’re welcome

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Author]

Posts