Hey guys, I ran into an issue last night that seems like a bug to me. I can’t post the public link as this is a real-world project in development.
The issue I was having was with the basic CSS inheritance. I made a navbar and gave a class to the nav links to have a new font color and background color. Here’s the issue, for the :hover state, you’d think that the font colour would be inherited from the new navlink class but it was picking up the font color from “All Links” global class. I had to give my hover class the same font color as the regular state in order for it to work properly. It just seems a little redundant to have to do this.
This appears to be a new ‘feature’. Webflow adds a color to All Links, but you can’t remove it. You can cancel it out by applying your own color, but you can’t get it to inherit back to the browser default.
An unstyled link has this default style.
I remove the style. Now it shows it’s inheriting the body text color.
Either way, the Webflow Blue is still persisting when the website is published.
I must use a line of custom code to get rid of the Webflow blue and behave as normal.
/* Resent Webflow’s a color */
a { text-decoration:inherit; color: inherit; }
I don’t like this either… I really like Webflow and try to advocate it as much as possible but little things like this make it hard sometimes. Why do I need to hack some css for some basic stuff that should be baked in? Yeah, I get that this tool is geared towards a lot of users and you can’t please us all but please don’t dumb it down so much that people who want to use it in an efficient and DRY manner aren’t able to.
I wasn’t able to reproduce this in the designer unless I have a specific color set on All Links class. Because a:hover is more specific than any .tab-class it will appear when hovering over the tab and will have to be overwritten by .tab-class:hover. Are you sure you didn’t have a hover set on “All Links”? That’s the only thing I can think of causing this inheritance issue.
It is a nicer blue, sure, but not worth the headache.