How to center your navigation in shopware 5?

First, You have to create a custom theme. To create a custom theme you can go through the below link.

Different ways of creating shopware 5 theme ?

Now, To centre your navigation in shopware 5 follow the following steps:

Our navigation looks like this.

Step 1: Go to the shopware theme directory of your website.

Step 2: Create the new sub-directory called main-navigation.less in _modules directory.

File Structure:–

themes/Frontend/Custom/frontend/_public/src/less/_modules/main-navigation.less

Note: Custom directory is a theme that I created already.

Step 3: Write this code in the main-navigation.less file.

@media screen and (min-width: @tabletViewportWidth) {
    .navigation-main{
      .navigation--list{
            text-align: center;
        }
    }
  }

Step 4: Import main-navigation.less file in all.less file.

Write this code in all.less file.

@import "_modules/main-navigation";

Results:

Please contact us at manish@bay20.com or call us at +91-8800519180 for any support related to shopware 5. You can also visit the Shopware 5 development page to check the services we offer.