I have to design a website for a figure ice skating club but I have some problems with the navigation.
What I want to achieve is aligning the navigation to the center but also letting it use the full width of the wrapper it’s in. Now I have set my padding to match it on my screen but as I already knew when doing it like this, It doesn’t stay on 1 line and the width.
The result has to be that the navigation links are spread from the clubname on the left to the logo on the right. It’s only for Desktop views as I use the mobile menu starting from Tablet’s view.
If I understand correct your wish, I think i know how to help you.
In this case navbar (don’t really know why there are 2 of them) sitting inside the wrapper, which has width 95% of the body. So navbar will not fit page width in this way.
If yo want navbar having full width you will have to move it out of “wrapper” or change wrapper size.
About menu-links. In such situation I am using % width for the links. For examples, you have 10 links, so make menu-link width 9.5% and 0.25% left and right margins. Also sometimes I am using VW for font size, which makes font size depended on screen width.
