Center Menu Header

[middlebeats]

How can I center the menu and icons?

Online Store: www.fatatjewellery.com

Password: fatat

[BSS-TekLabs]

Do you want like this @middlebeats ? 

[middlebeats]

Hi,

Yes, but the icons should be centered below them and aligned in the center

[BSS-TekLabs]

- Here is the solution for you @middlebeats 
- Please follow these steps:

- Then find the base.css or theme.css file.
- Then add the following code at the end of the file and press 'Save' to save it.

 

@media screen and (min-width: 1200px) {
    .header--center .header__inline-menu, .header--center .header__column {
        position: absolute !important;
        width: 100% !important;
        justify-content: center !important;
    }
.header {
    padding: 0 !important;
    padding-bottom: 10px !important;
}
}

- Here is the result you will achieve:

- Please press 'Like' and mark it as 'Solution' if you find it helpful. Thank you.

[Sangeetanahar]

hello @middlebeats 

You need both the menu and icon together in the center

Thanks

[devcoders]

Hi @middlebeats 

- Go to Online Store -> Theme -> Edit code.
- Find the file assets/base.css and paste the code below at the bottom of the file."

header.header.header--center.fullscreen-container.header--has-menu {
display: flex;
}
nav.header__inline-menu.header__inline-menu-first {
justify-content: center;
margin: 0;
}
.header__column {
justify-content: center;
margin: 0!important;
}