Center navigation menu, Patchwork theme

  • Hey guys,
    Does anybody know how to center the navigation menu? I’m using a child theme, and I don’t want to hard-code anything (like adding a number to “left” or margins).

    Here’s the site: https://www.primas2day.com/

    Any help will be greatly appreciated (-8

Viewing 10 replies - 1 through 10 (of 10 total)
  • Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    Are you certain menu items won’t change name, be removed or added?

    Thread Starter primHel

    (@primhel)

    No, I’m not certain, so I want to keep the whole thing as flexible as possible ??

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    If you’re not certain, you can’t have a centred menu.

    Thread Starter primHel

    (@primhel)

    ok, I’m not sure I’m following you on this, could you please elaborate?

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    Are you familiar with CSS block elements?
    To center a block element, you need to add a width.

    Thread Starter primHel

    (@primhel)

    sure, but say I’ll add or remove one menu item now and then, so that the navigation menu might contain 3-5 items.

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    If the menu has 3 items and you have a width wide enough for 5, the menu will be off-set from the center.

    Thread Starter primHel

    (@primhel)

    Right, ok, so that pretty much means that I will have to hardcode something ??

    Say I have four menu items, how do I go about centering the navigation menu then?

    BTW, thanks for taking the time, Andrew.

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    Say I have four menu items, how do I go about centering the navigation menu then?

    Look at the resource referenced above, “To center a block element”. You need to add a margin: 0 auto; and a width: to the exact width of all menu items. Try adding this to your <ul> element in the Child Theme style.css file.

    Thread Starter primHel

    (@primhel)

    Thanks

Viewing 10 replies - 1 through 10 (of 10 total)
  • The topic ‘Center navigation menu, Patchwork theme’ is closed to new replies.