Problem with flex on navbar

Design help General
#1

Hello,

I’m trying to put some flex on a standard navbar but it is not giving me the expected results?

I want the logo on the left and the nav-links on the right.

But when I use:
Display: Flexbox
Direction: Horizontal
Align: Stretch
Justify: Space-between

It won’t go to the sides of the container

here is my share link:
https://preview.webflow.com/preview/navbarflex?utm_medium=preview_link&utm_source=dashboard&utm_content=navbarflex&preview=0ce50b78cc98767a70f82fa059d5428a&mode=preview

Strange Flexbox Behaviour
#2

It is because you’re doing this on a Container element and there’s a bug with Flexbox Space Between and Webflow containers: it does what you’re witnessing.

Simple method to get what you want:

  1. drag a div inside of the container, drag everything that was in the container inside the div, make the div width 100%. Now apply your Flexbox settings to the div and you’ll get what you expect.
  2. I forgot I was making a list of steps, there’s no more steps.
1 Like
#3

Thanks for the quick response i already use that work around ;). Was just wondering if it was possible with the default navbar