Why is my nav bar text black?

Going through the styling part of my nav bar and I noticed that the text is black. I seem to be at a loss where it’s defined as black as I have specifically set it to blue but it is showing as black.

http://einclick.webflow.io/

https://preview.webflow.com/preview/einclick?preview=66d86a2f153450d4e0429baf04714cf4

There is something over-riding the colour and I’m at a bit of a loss for where. I followed the navigator ladder and could see no classes that would do so.

Wow! Seems like a simple thing, but yeah - I can’t figure out what’s overriding that either… Very odd.

@DragonDon it’s black because magic :wink: regardless, fix as below:

Arthur

1 Like

Hi @DragonDon, following up with the good info by @Arthur, thanks for that. When I looked at the Home link, it was having the All Links class only, so add the Navlink class as shown in @Arthur’s image :slight_smile:

(thought I would mention that in case you thought the navlink class was already created ) :smile:
Cheers,
Dave

2 Likes

@DragonDon yeah @cyberdave is right :slight_smile: the issue was that the nav link classes were just “all links”

Arthur

Hang on. I did that and nothing changed.

https://gyazo.com/a694e2a325946cec1576e3a127307e3d

The reason why I said that something else is ‘overwriting’ the colour was because when I went into the Element Inspection in chrome I saw this:

And then, when I removed the checkmark from the colour, all went blue as expected:

Sooo, err, why didn’t mine change colours when I added the class?

Ugh…I suppose the problem is the tool and not the result. Opening up the page and the font is now blue. So something is being cached and not updated somewhere. :confused:

Errr…check that…I don’t know what happened, in another tab, the site was showing a blue font, so I refresh my design tab and still showing black, the tab with the site in it went black after refreshing that one. Ugh. This is maddening.

First - I’m looking again at your original shared link and it seems that if i click on each nav item, Home, Services, About, etc. that not all of them have the nav link class applied to them.

Second, once you apply that class to each nav item, try changing the color of the class to something else, then back to the Blue. It’s weird but that’s the only way I got the color to stick.

Additionally, once you get this working on one page, you should really convert it to a symbol and put that symbol on all pages rather than having a different Navbar on each page. Because, right now you would have to make edits on the nav bar on every page.

Hope that helps!

JFly

1 Like

Hi JFly,

Thanks for the response. I tried the ‘change and change back’ method but that only worked once for two elements. It’s like the copied nav links were not copied correctly. I simply deleted them, copied them again and all is working. Totally weird but they seem to behaving better now.

Thanks for the symbol suggestion. Wasn’t even aware of it and glad for looking it up now :smile:

Hmm, there seems to be a problem using symbols. When I go to another page, then click on any nav link that leads back to the home page, it fails. It keeps trying to find a section ID on the same page as opposed to switching pages. This is obviously not a desired action.

And here we go again. I make a change and it does not get reflected in the site.

My home button originally went to a section titled ‘blank’. I changed that section name to ‘home’ and the nav link settings change automatically, I published the site but when I open it in a browser, the link still tries to go to the old name of ‘blank’.

Webflow, for some reason, stops publishing certain changes to the site.

Everytime in the past this has happened, the ONLY fix was deleted the whole element/section and recreate it. This is getting to be a bit frustrating after already spending a significant amount of time trying to set it up in the first place.

I’ll deal with the issue if the styling box blocking the “Home” text in another post…

Hi Don,

So the changes aren’t showing after you publish the site? Do the changes show up when you “preview” the site (clicking the eye icon near the top left)? Make sure you are publishing it correctly, clear cache or check it in another browser.

Also, this may not have anything to do with your problem, but I noticed that you have URLs in the nav links. Is there a reason why you aren’t linking to the section using the Webflow UI? (See pic.) Or am I missing something here…

I have gone through the usual suspects of cache clearing, different browsers and such. Made no difference. As previously mentioned(at least I think I did in this thread?), the ONLY difference that ever helped was deleting the whole section and recreating it. Something just does not seem to be getting through.

As for the links, I suspect you happened to be looking at the nav during a transition as the only nav bar that uses links is any nav bar not on the home page as I’ve been told that is the only way to get back to a section on the home page(i.e. about us) from any other non-home page. Otherwise I use the in-page linking options on the home page.

Hi @DragonDon,

I was checking the Home link on the home page from your screenshot, and on the published page, it is pointed to:

http://einclick.webflow.io/#home

Are you seeing the same thing? Are you still having that issue with the link ?

Cheers,
Dave

Hi @cyberdave,

Nope, it seems that I fiddled enough with it to get it working again now. I removed the Symbol association and everything seems to be working as expected so far.

Thanks for your concern, really appreciate it!

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