Hello. I’m stalled out and need some advice, please. I’m creating a centered logo header with the main nav links centered under it. The available ready-made navbar only seems to allow for the nav links to stay on the right side, even when i center the text on it’s parent element. So I created a three-button nav bar that is centered. I was pretty happy about that. But of my three button links, one is a dropdown menu. So I added a dropdown button to the other buttons and added the same class to it as the other two, but it sits down and out of alignment with the other two. I’ve tried adding the class to some of the child elements inside the dropdown button and a few other things but i am flummoxed. Attached is a screen shot. Also, here is the share link: https://preview.webflow.com/preview/longfeather-book-design?preview=ee0ab5c767658dcf15a518cf2c7951d6
I’ve been searching for this topic but haven’t found anything to help. Any wisdom would be much appreciated.
I managed to fix this the way you have it but I had to alter a few things. The main thing is that your ‘nav_buttons’ class is set to the dropdown toggle rather than the dropdown element that this is enclosed in, however as well as changing this I did also need to add another class to the toggle to reduce its standard top and bottom padding as well. Then you might want to customise the left and right padding, which knocks the icon out of place, etc… There may be an easier way but this is what I ended up with:
Incidentally, you should have been able to make this work with the standard nav bar. The ‘Nav Menu’ element just needs to have the ‘float right’ removed and then centering as you have done there should work. You’ve basically made the same thing though.
It is very helpful. Thank you, Joshua! Thanks for taking the time to figure this out. It’s was an elusive obvious for me and I’m so glad you stepped forward to help. Much gratitude.
