Re: Center Menu Header

Center Menu Header

middlebeats
Shopify Partner
19 0 6

How can I center the menu and icons?

Online Store: www.fatatjewellery.com

Password: fatat

 

Screenshot 2024-08-15 at 4.14.22 PM.png

Replies 5 (5)

BSS-TekLabs
Shopify Partner
2350 688 806

BSSTekLabs_0-1723728280596.png

Do you want like this @middlebeats ? 

 

If our suggestions are useful, please let us know by giving it a like or marking it as a solution.


Salepify: Efficiently increase sales conversion with sale-driven features like auto add to cart, free gifts (free plan available)


Salemate: Boost your AVO with 2-layer offer, countdown upsell in your post purchase page


BSS Commerce - Full-service eCommerce Agency | Use Shopify for 1$ in the first month now
middlebeats
Shopify Partner
19 0 6

Hi,

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

BSS-TekLabs
Shopify Partner
2350 688 806

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

z5686811214059_e66de1953f1db631f9134af5cdb796ad.jpg

- 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:

BSSTekLabs_0-1723729400370.png

 

 

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

If our suggestions are useful, please let us know by giving it a like or marking it as a solution.


Salepify: Efficiently increase sales conversion with sale-driven features like auto add to cart, free gifts (free plan available)


Salemate: Boost your AVO with 2-layer offer, countdown upsell in your post purchase page


BSS Commerce - Full-service eCommerce Agency | Use Shopify for 1$ in the first month now

Sangeetanahar
Trailblazer
556 36 66

hello @middlebeats 

You need both the menu and icon together in the center

Thanks

Was I helpful?

Buy me a coffee



Want to modify or custom changes or bug fix on store . Or Need help with your store? Or -Want Complete Storefront
Email me [email protected] - Skype: live:sangeetarahuldhiman -Whatsapp: +917009811712
Checkout Some Free Sections Here

devcoders
Shopify Partner
368 57 92

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;
}

 

devcoders_0-1723728998763.png

 

Shopify Developer: Helping eCommerce Stores
If you need assistance with your store, feel free to contact us at [email protected].
If my assistance was helpful, please consider liking and accepting the solution. Thank you!