Streaming live at 10am (PST)

Vertically centered navlinks in navmenu


#1

Hey guys,

I am working on a nav for a client and am trying to center the navlinks but am having trouble.
Here is my public link:
https://preview.webflow.com/preview/elle2?preview=07e4afa0c96249d4f7ee65b557fd2d7f


#2

I made the navlinks flex and centered them using flexbox. And then removed the padding. You have to do this twice once for navlink current and again for the navlink.

Hope this helps


#3

I tried it but didnt work for me.


#4

weird i just did it on your share link. You are selecting the navlink?


#5

Im legit trying this on my mac but its not working


#6

Did you get it to work? If not seems like a bug on your end? Sometimes I find I need to refresh webflow


#7

No mate. I keep trying but nothing happens. It just aligns it to the top


#8

Send a help email. I don't use a Mac so i have no idea why it wouldn't work the same. Seems like something is not working properly. That is very basic functioning. You are using the exact same settings I have in the photo???

on Navlink, and Navlink Current, Set to Flexbox, Flex settings - Justify Center, and Align Stretch, 0 left and right padding?

@VladimirVitaliyevich u use a mac don't you? Any ideas why he is having trouble. Something in mac settings?


#9

@jbleroux @Hamzster They were not centered for me too, I am using iMac 4K, but then I noticed the navlink was not centered in the class property. So I pressed align text on the navlink element and it all worked out as intended. :wink:


#10

@VladimirVitaliyevich yeah that even worked better without the need to flex anything. I generally go the more complicated route on anything it seems. :smirk:


#11

Guys I'm trying to vertically center it in the nav menu! Not center in in terms of alignment


#12

Can you provide a quick sketch of exactly what you would like to see... like maybe a prototype image? Thanks! :smiley:


#13

Famous.cohttp://famous.co is using the same navigation style. The Navlinks are centred vertically on the page.how do I do that?


#14

This is what I am seeing on my monitor, is this wrong or would you like it to appear like this?


#15

This is right! But when you resize you browser virtually it won't change.


#16

Hey guys,

You guys arent seeing the issue becuase of the padding on the navmenu element. I have removed it. Now please show me how to vertically center the nav items.

https://preview.webflow.com/preview/elle2?preview=07e4afa0c96249d4f7ee65b557fd2d7f


#17

I see your issue. You want the whole menu centered in that navmenu div. Yeah nothing is working. I'm wondering if there are some styles associated with the navbar that are not letting you change that. Have you tried building the navbar from scratch? You have way more control of it.

https://preview.webflow.com/preview/tweetshoppeandvintagerentals?preview=f5afb0f1836410a7286f5f0d71856830

take a look how I built the one here on the tweet shoppe main page.

I find building them from scratch works the best anyway. As an alternative contact the support team and maybe they have a solution. They are the experts

jeremy


#18

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