How can I center my mega menu in the Craft theme?

As far as I checked in DevTools, the element containing 4 menu options has the justify-self: center property. This property will help the element be centered.

But if you still want to adjust the position of this element, you can do the following:

In Online store, select Themes → … → Edit code

In base.css, add the following code at the end of the file:

@media screen and (min-width: 990px) {
  .header--top-center .header__inline-menu {
    padding-left: 1px;
  }
}

or the following code:

@media screen and (min-width: 990px) {
  .header--top-center .header__inline-menu {
    margin-left: 1px;
  }
}

You can use 1px or any number you want

Click Save to save changes.

Hope my answer helps you.

1 Like