How can I center my webpage menu?

[shyannscottage]

How do I move my menu into the centre, it looks weird and uneven now.

[harivishwakarma]

Hallo @shyannscottage 

You can add code by following these steps to change

1. Go to Online Store -> Theme -> Edit code > assets > base.css

paste below code at bottom

header.header.header--middle-left.header--mobile-center.page-width.header--has-menu {
display: flex !important;
justify-content: space-between !important;
}

If you require any further information, feel free to contact me.

Best regards,

[Simonsron]

give me your shop url

[GemPages]

Hello @shyannscottage 

Could you please share your store url ( with pass if your store password is enabled ) or the theme you are using then I can see and suggest something for you?

Best regards,
GemPages Support Team

[harivishwakarma]

Hallo @shyannscottage 

You can add code by following these steps to change

1. Go to Online Store -> Theme -> Edit code > assets > base.css

paste below code at bottom

header.header.header--middle-left.header--mobile-center.page-width.header--has-menu {
display: flex !important;
justify-content: space-between !important;
}

If you require any further information, feel free to contact me.

Best regards,

[shubhamSharma]

hello @shyannscottage 

Step 01:
1. Go to your Store > Theme > click to edit code.
2. find this file " theme.liquid" and open.
3. Paste the code at the before end of the  </body>.

<style>
.header-wrapper .header {
    justify-content: space-between;
    display: flex;
}
</style>

this idea helps you

[topnewyork]

Hi @shyannscottage ,

If you want to center the header menu, try this tutorial. I hope it will be helpful to you.

Thanks!