Header space between elements on mobile

[playandco]

I’m having an issue creating a “space between” effect on the mobile version of my header.

On mobile view, I have two elements displaying in my header: the logo and the navigation. Right now, they are pushed next to each other and centered. I want them to be pushed away from each other, with space in between, so that the logo is on the left side of the screen and the navigation is on the right.

I’ve tried assigning the flex layout of the container to “Space Between” but it’s not having any effect.

Can someone show me why this isn’t working? URL in secure note.

[ruenel]

Hello There,

Thanks for writing in! The best solution to this issue is to create two separate bars. The first bar is for your desktop and the second bar will be displayed for smaller screens. You can show/hide these bars using the “Hide During Breakpoints” option which you can find in the “Customize” tab.

Hope this helps. Please let us know how it goes.