Navbar in Flexbox

Gianluca_Dorio · October 9, 2018, 7:54pm

Hi guyss,

how do I extend the navbar to the full width of its wrapper? (parent)

I used the flexbox property but I can’t control the last button (A LINK TEXT) alignment with the “Search” button

The flexbox property, I gave it to the “navbar”, “container” and “nav” classes

It must be all aligned as in the screenshot example below:

where am I wrong?

Link project: Webflow - mpp

Thanks

Nilson · October 9, 2018, 9:22pm

Hi!
Delete the container from the navbar and set the nav div to block.
And you need to delete the margins of the logo and the nav links.

Nils

knk · October 9, 2018, 9:27pm

Hi @Gianluca_Dorio,

Made a video to help get your nav aligned (video is 5mins!)
You can also drag the children of the default container under the Nav element then delete the default container and do the flex settings as per the video.

See how you go.
Regards,
Keiran

Nilson · October 9, 2018, 9:48pm

Awesome @knk Good video

Gianluca_Dorio · October 10, 2018, 4:52pm

Hi Keiran, sorry if I answer only now … but I was painting my house.

I am speechless, the video was very useful !!!

Thank you, and I thank you all for your availability. It’s the first time I find people like you.

Regards,
Gianluca

Gianluca_Dorio · October 10, 2018, 4:54pm

Hi Nilson,

thanks for the precious info, I succeeded !!!

Gianluca

knk · October 11, 2018, 5:18am

Hi Gianluca,

You’re welcome. Glad you got it sorted.

All the best with painting your house. I am also currently painting a house!! (Although the outside)