Center top menu links in Dawn 15.0

[crosbyaudio]

Looking to center the top menu links in Dawn 15.0. Thanks!

https://crosbyaudio.com

[PageFly-Amelia · Accepted solution]

Hi @crosbyaudio 

This is Amelia from PageFly - Landing Page Builder App

You can try this code by following these steps: 

Step 1: Go to Online Store->Theme->Edit code. 

Step 2: Search file base.css

Step 3: Paste the below code at bottom of the file -> Save

header.header {

    grid-template-columns: auto !important;!i;!;

    justify-content: space-between;

}

Hope that my solution works for you.

Best regards,

Amelia | PageFly

[crosbyaudio]

Thanks. Are you able to provide code to center this title on the home page?

[Made4uo-Ribe]

Hi @crosbyaudio 

check this one. 

From your Shopify admin dashboard, click on "Online Store" and then "Themes"

Find the theme that you want to edit and click on "Actions" and then "Edit code".

In the "theme. Liquid" file. Find the </body> tag and paste the code below before the tag. 

<style>
@media screen and (min-width: 990px) {
    .header-wrapper .header--middle-left {
        grid-template-areas: 'heading navigation icons';
        grid-template-columns: 1fr auto 1fr;
        column-gap: 2rem;
    }
}

</style>

And Save. 

Result:

Please don't forget to Like and Mark Solution to the post that helped you. Thanks!

[Tech_Coding]

Hello @crosbyaudio 

You can add code by following these steps

1. Go to Online Store -> Theme -> Edit code.
2. Open your theme.liquid file

3. Paste the below code before </body> on theme.liquid
<style>
@media screen and (min-width: 990px) {
   .header .header__inline-menu {
      display: flex !important;
      justify-content: center;
      align-items: center;
   }
}
</style>

my reply helpful? Click Like to let me know!
your question answered? Mark it as an Accepted Solution.

[BSS-TekLabs]

- Here is the solution for you @crosbyaudio 
- Please follow these steps:
1. Go to Online Store --> Theme --> Edit code.
2. Open your theme.liquid file
3. In theme.liquid, paste the below code before </head> and press 'Save' to save it

<style>
header.header.header--middle-left.header--mobile-center.page-width.header--has-menu.header--has-social.header--has-account {
    justify-content: space-between !important;
    grid-template-columns: auto !important;
}
</style>

- Here is the result you will achieve:

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

[websensepro]

Hi @crosbyaudio ,

1. Go to Online Store -> Theme -> Edit code.
2. Open your theme.liquid file
3. In theme.liquid, paste the below code before </head>

<style>
@media screen and (min-width: 990px) {
    .header-wrapper .header--middle-left {
        grid-template-areas: 'heading navigation icons' !important;
        grid-template-columns: 1fr auto 1fr !important;
        column-gap: 2rem !important;
    }
}

</style>

If my reply is helpful, kindly click like and mark it as an accepted solution.

Thanks!