Streaming live at 10am (PST)

Vertically centering items in Navmenu


#1

How do I vertically center the navlinks in the navmenu?


https://preview.webflow.com/preview/emr2?preview=45013c5930260e9f1606cb77169cc5e3


#2

The easiest way is to apply flexbox to the parent container and choose the vertical center option.


#3

yeah, the nav component needs a redesign or maybe a new one needs to be created that is all based on flexbox...but yes, adjusting everything to use flexbox will solve many issues :slight_smile:
Check out this article on to help understand flexbox, if you don't already know :slight_smile:

https://css-tricks.com/snippets/css/a-guide-to-flexbox/

Cheers,

R


#4

Correct me if I am wrong but the flexbox display option does not work on the navmenu element correct?
Also, if I made the NAV myself how do I set it up to have the hamburger icon?


#5

You can style the Nav component with flexbox, you just need to strip it of it's original styling...you also need to re-do it for every site you build. @webflow is building a plugin system that will help people make better components, but it's not ready yet. Just add a Nav component to your site then select every element and choose to style it with flexbox, see what happens, then fix the issues. It pays massive dividends to understand flexbox so that you can problem solve as you go. I'm happy with my Nav component design now, but it took a solid understanding of flexbox and plenty of trial and error to make it work. But now...oh man, it's so nice :slight_smile:


#6

This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.