Logo in Navbar – padding and menu center

[scott doel]

Hi Tom,

have copied the solution posted here and added padding left of 2 cm.

But I also have padding below the menu, and the menu has shifted to the right

Is it possible you could help me with the CSS to:

1. remove the padding from below the menu
2. have the primary menu still centre

GeneratePress 1.3.44

GP Premium 1.2.94

[scott doel]

Just thinking you might need a link to the website!

[Tom]

Hi Scott,

Have you tried using the built in Navigation Logo option?: https://docs.generatepress.com/article/navigation-logo/

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-development

[scott doel]

I’ve tried it now, but the menu still gets pushed to the right. Also, I can’t centre the logo vertically within the menu

[Tom]

Where are you wanting the menu to be? Next to the logo or all the way to the right?

For vertical centering, try this:

.main-navigation .navigation-logo {
    padding-top: 5px;
}

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-development

[scott doel]

No I wanted the log to be center, but the center option still leaves it pushed to the right after adding the logo

[Tom]

You want the logo to be centered, or the menu?

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-development

[scott doel]

Sorry Tom, I want the menu to centre of the page

[Tom]

Ah ok, you’ll need to take the logo out of the flow of the page then.

Try this:

.main-navigation .navigation-logo {
    position: absolute;
    left: 0;
}

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-development

[scott doel]

Perfect! Thank you Tom

[Tom]

You’re welcome 🙂

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-development

[Author]

Posts