Six nav buttons on the left, with a header box filling the same height as the nav items on the right. I also need the possibility to add more nav buttons in the future, and for the header box to continue filling the height, whatever height that may be.
I’ve found a few ways to achieve this, but I’m wondering what is the most proper way? I don’t want to hurt the responsiveness of the site.
Hi. Webflow Grid use FLEXBOX - so this is the default behavior of cols on display:flex:
Option 1 - columns
Create layout by columns - one col for the list and one for the heading (add style to change the space between columns)
Option 2 - Flexbox
For more complex layout you can use flexbox boxes (in your case the layout is very simple so columns should work better - easy to set and control responsive)
“Page heading” Center-Center always
If you want “page heading” (right col) to be always Center V and H - do this again by flexbox