Center logo and menu items desktop view

2 0 0

Hi there!

I'm really struggling on centering my logo and evenly spacing the menu items on my desktop view.

Can anyone please help?

Thank you so much!!

pass: chaort 


Captura de ecrã 2024-01-29, às 16.45.01.png

Replies 2 (2)

Shopify Expert
3465 460 515

Hi @isameloc ,

As your requirement, you can try my solution by fixing CSS in your theme:

Hope the result below is as you want: 

view - 2024-01-30T184630.177.png

In your menu header there are 4 classes: 

- header__inline-menu-left

- header__inline-menu-right

- header__heading (logo)

- header__icons

I added the order property in the correct ascending order from 0 -> 3 to realign the position of the classes, and also added some other css properties to make it more well-proportioned. 

You can do this in admin.shopify: 

Sale channels => Online store => Theme => Edit code. Search base.css and insert the css at the end of the file: {
    display: flex;
    justify-content: space-between;
    justify-items: center;

.header__inline-menu.header__inline-menu-left {
    order: 0;

.header__heading {
    display: block;
    margin: 0 auto;
    order: 1;

.header__inline-menu.header__inline-menu-right {
    order: 2;

.header__icons {
    order: 3;

Hope it helps!


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

For B2B solutions and custom pricing, check out B2B Solution & Custom Pricing |
For adding product labels/badges, visit Product Labels by BSS

BSS Commerce - Shopify Apps & Store Development Service Provider

Hire a Shopify expert | Shopify Plus Store Development

2 0 0

Hi @BBS-Commerce, 

Thank you so much for your help. 

Your solution is closer to what I envisioned but I need it to be more like this: 




- the logo should be centered with the page (not the male model picture)

- The menu items more spaced between them and evenly distributed on the box.


Can you please help?

Thank you so much!