How can I center the Main Menu in the updated Dawn theme?

Store Design
1

Does anyone have code to center the Main Menu in the updated Dawn theme?

url: preacha.com

1 Like
2

@ebon

Please try this code 1. Go to Online Store->Theme->Edit code 2. Asset->/base.css–>paste below code at the bottom of the file.

.header.header--middle-left.page-width.header--has-menu {
  text-align: center;
}

Thanks!

3

@ebon

Please remove provided css . i will check and send correct solution to you.

4

Thanks for the code but it doesn’t work

5

@ebon

Please try this code 1. Go to Online Store->Theme->Edit code 2. Asset->/base.css–>paste below code at the bottom of the file.

@media screen and (min-width: 990px){
.header__inline-menu {
    display: flex !important;
    margin: 0 auto !important;
}
}
6

still no good.

7

@ebon

Please remove previous css and add this new css class

@media screen and (min-width: 990px){
.header {
    padding-top: 0!important;
    padding-bottom: 0!important;
    display: flex !important;
}
.header__inline-menu {
    display: flex !important;
    margin: 0 auto !important;
}
}
2 Likes
8

Perfect!

thank you

9

@ebon

If helpful then please Like Solution

10

This code doesn’t work

11

Hi, new to Shopify;) Should this code be applied to base.css?

Thank you in advance

12

It’s where I placed it and it worked.

1 Like
13

Thank you, I didn’t see that part of the feed. :wink:

1 Like