Hello,
I am trying to style the navbar menu links. I am unable to control it effectively. 3 Problems:
Why are my 2 of my nav links still blue in the default state? I want them to be white by default, Red on hover, and a Red + underline when selected. I do not want any changes on Pressed or Focused states.
How do I style a link in the “selected” state- when the link shows what page it is on…? Right now, there is no way to see what page has been selected…
How do i remove any styling i might have added for a particular state? I am getting a bit confused between the ‘Current’ state and the state where there is no ‘Current’…
You styled default and hovered states correctly. Only left unstyled current state. Here we go to other 2 problems.
and 3) So Current state it is what you call “selected”. It appears next to link’s class when on the screen view appears page or element connected to this link
By default (if it is not styled) it takes default style settings of all links on the site. So all you need is style link in its current state as you plan (red+underline)
Anna,
thank you very much for the explanation! The key was in understanding that the selected page is the current page. Terminology!
I was able to successfully correct the blue link and make it red.
HOWEVER I see that the desired behavior happens only to the Case Study and Process pages. The Resume page does not seem to retain the red underline that i want in the Current state. It goes back to the default state of white… I checked the class names and they are all the same (NavLink). Can you please help with this?
Here it is. The question is that the navbar seems to ‘load’ onto the page everytime. Right now, it appears cached on my machine and seems ok.
Also, after the recent webflow update, it looks like the navbar is “behind” the rest of the page. I had to create margins for all 3 pages to push below the navbar and avoid getting behind it. …
About Navbar being “behind”. It has nothing to do with Webflow updates. It is CSS rules. If element has fixed position (like your navbar has), positioni of other elements on the site will ignore navbar position and size. And yes, adding top margin in this situation is usual decision.
