How can I center both main and submenu headers on my website?

Store Design
, , ,
1

How can I center the menu in the header? as well as the submenu under SHOP

hasanali1_1-1679652726853.png
hasanali1_1-1679652726853.png322×161 32.8 KB

website - https://the-style-luxe.myshopify.com/

password - reucho

thanks in advance!!

2

Hello @hasanali1

To make menu center follow this steps :

  1. In your Shopify Admin go to online store > themes > actions > edit code
  2. Find layout > theme.liquid and paste this at the bottom of the file:

Hope this works well.

1 Like
3

Hello @hasanali1

It’s GemPages support team and glad to support you today.

I would like to give you a solution to support you.

  1. Go to Online Store → Theme → Edit code.

  2. Open your assets/base.css theme file.

  3. Add the code at the end of the file:

.header{
  grid-template-columns: auto 3fr 1fr !important;
}
.header--middle-left .header__inline-menu{
  text-align: center !important;
}

Hope my solution can work and support you!

Kind & Best regards!

GemPages Support Team.

1 Like
4

Hi @hasanali1

I hope you are doing good and welcome to the Shopify Community!
I am San from MS Web Designer.

Please add this css in your bottom of the css file:

@media screen and (min-width: 990px) { .header--middle-left .header__inline-menu {width: 120%; text-align: center;} }

Regards,

San

5

Please add the following code at the bottom of your css file.

.header{
grid-template-columns: auto 3fr auto !important;
text-align: center;
}

.header--middle-left .header__inline-menu{
text-align: center !important;
}