[Support request] Center menu in header?

[Olle]

I’m trying to do a simple header with a nav centered horizontally in it. Why is it not any option for that? Only “above header” and “below header” but that is putting it outside the header. Float left or right in header but no center option.
I have an example here http://mertzig2.karneman.com/ this is done by giving #site-navigation a width and margin auto. But not so good for obvious reasons. Do I have to use Flexbox?
I can’t believe that such a simple option is not in the settings. What am I missing?

Regards
Olle

[Tom]

The way you’ve set it up there is how I would suggest doing it.

There’s not an option as it hasn’t been requested very often. In most cases people just disable the header and center align the navigation. Doing that renders a very similar layout.

[Olle]

Yeah but it’s not very flexible and not responsive.
So if I start with a logo and a menu and then decide of removing the logo from the menu.
My option is to rebuild the menu? CSS and all. To be on top or below the header?

It would not be so hard for you to include a centering option for the menu in the header.
Makes your theme more flexible. How many people that have made the request is irrelevant I think. You don’t make the theme based only on requests. But rather on flexibility an user experience an simplicity for the user.

Regards
Olle

[Tom]

I’m not sure I understand the first question. Why would you need to rebuild the menu?

Every option we build into the theme adds more bloat. More options means more code, which everyone has to load. So if we add an extra 30 lines of CSS (for example), every single website using GP has to load that code.

That’s why it’s important we only add options that the majority of users will find useful. Otherwise GP would turn into another theme forest theme very quickly. GP has been popular for over 4 years and it’s still lightweight – keeping options to a minimum is the reason for that.

[Olle]

With all the respect. In this case it’s only about two lines of CSS not 30.
Change the .inside-header to inline-block and text-align:center; And then #site-navigation to float:none;

I don’t think it adds to the theme being bloated. It just makes it more flexible and better.

Regards
Olle

[Tom]

Unfortunately there’s quite a bit more involved than just that. Options need to be added, PHP for classes need to added.

If it’s requested more, I’ll absolutely consider it 🙂

[Author]

Posts