How to change the width of menu bar on dawn theme

Store Design
1

How do you change the width of the menu/navigation bar to full page on dawn theme? I dont want to change the width of the header but only the width of the menu bar to full page.

1 Like
2

@twacomm-store Do you mind if you share the product URL. Also if it is password protected then share the pass. If you have issue to share the pass , you can share the pass in my inbox.

1 Like
3

@twacomm-store

From your Admin panel, click Online Store > Themes >Actions > Edit code
find and open the base.css file
Paste the code below at the very bottom of the file.

@media(min-width:1000px){
    .header--top-left{
        grid-template-columns: 1fr 1fr !important;
        width: 100% !important;
        padding: 0 !important;
        margin: 0 !important;
        max-width: unset !important;
    }
    .header__icons{
        width: max-content !important;
        justify-self: center !important;
        margin-left: 27rem !important;
    }
    .header__heading{
        width: 80% !important;
        justify-self: flex-end !important;
    }
}
4

Hello there, I have same requirement. I tried the code editing but it seems it’s not working or maybe I’m doing something wrong.. Is it still possible to ask you for help and share my url and pass please?
Many thanky in advance.

5

I know this is from 2022… it worked for me but the menu is not centered. Can anyone help me learn how to center it within the header? I see “margin left” in the code, but if I change left to center it looks like it did before I added the code.