How to evenly space out the header menu components? DAWN THEME

Store Design
1

I want to evenly space out the header menu component depending on the screen size, or 100% view port.

As in there are 3 components as shown below in the picture and I want them evenly space in between those elements and take up the full screen width.

Please refer the screenshot down below for clarification

Capture.PNG
Capture.PNG1891×819 166 KB

I think this can be done with:

justify-content: space-between;

But I do not know which CSS class I should apply this to.

Any help and support are much appreciated,

URL: Abbasi (theabbasiandsons.myshopify.com)

Password: testingpage

2

@justauser

add this code to your base.css file.

Navigate to online store >> Click edit theme code.

Now find base.css and paste the following code:

.header{
    min-width: 100%;
    display: flex !important;
    justify-content: space-between;
}
1 Like
3

@eFoli-Marvic Thank you! much appreciated