Chrome doesn't respect <a> color when link is visited

user_12189768 0
Viewed 703

I have a strange bug that only occurs on Chrome - visited links ignore the color attribute and turn black. The chrome inspector shows the computed color as "white", even though it is clearly black.

This is NOT caused by :visited, as I'm using the same text color, whether it is visited or not.

Here's a minimal fiddle:
You need to visit wikipedia for the bug to appear.

<a href="https://www.wikipedia.org/#">This text should be white</a>
<a href="https://www.wikipedia.org/">This text should also be white, but isn't</a>

Now, I know this is in part caused by "all: initial", but I need to use this to keep a consistent style in my webextension, since websites override random CSS properties.

google-chrome css
1 Answers

If you're having issues with the visited color being overwritten by the browser defaults, are you able to instead set all to unset?

#popup {
  all: initial;
}

#popup * {
  all: unset;
  display: block;
}

After looking around, not 100% sure why the browser color was overriding the visited anchor, even testing #popup * {color: initial;} rule worked, so I'm not sure what underlying mechanism is changing the text color. But looking over at the answer provided here https://stackoverflow.com/a/15903168/1440950 using unset clears the values as desired

user_14409500
Related