Why Doesn't This A:Visited CSS Style Work

Why doesn't this a:visited css style work?

Actually, this has nothing to do with case sensitivity. This is a security feature. The functionality of :visited pseudoclass has been restricted in many modern browsers (Fx4, IE9, Chrome) to prevent CSS exploit: read about it here.

Nowadays, getComputedStyle() in these browsers usually returns values for visited links as if they weren't visited. However, I can simply imagine circumventing of that: using font-weight for visited links, the element's width changes so browsers that would allow changing font-weight for :visited links wouldn't actually fix the security hole.

You can see there are some specific things browsers do to protect against this:

• The window.getComputedStyle method, and similar functions such as element.querySelector, will always return values indicating that a user has never visited any of the links on a page.
• If you use a sibling selector such as :visited + span, the adjacent element (span in this example) will be styled as if the link were unvisited.
• In rare scenarios, if you're using nested link elements and the element being matched is different from the link whose presence in history is being tested, the element will be rendered as if the link were unvisited, as well.

Thus, there's no workaround for this issue.

CSS link border style not working on a:visited

border-style is not something you can overide on the visited pseudo-class

From MDN

Note: For privacy reasons, browsers strictly limit the styles you can apply using an element selected by this pseudo-class: only color, background-color, border-color, border-bottom-color, border-left-color, border-right-color, border-top-color, outline-color, column-rule-color, fill and stroke. Note also that the alpha component will be ignored: the alpha component of the not-visited rule is used instead (except when the opacity is 0, in that case the whole color is ignored, and the one of the not-visited rule is used).

Also Privacy and the :visited selector

Why are certain CSS properties not applied to a:visited?

You're not doing anything wrong - it just doesn't work that way (anymore). Styling of :visited was used as a security hole, so browser manufacturers basically eliminated alternate styling for :visited except for a handful of properties (e.g. 'color', 'background-color')

See: http://hacks.mozilla.org/2010/03/privacy-related-changes-coming-to-css-vistited/

Does Chrome have issue with setting a:visited css properties?

Instead, use the following:

a {
   background-color: white;
}

a:visited{
    background-color: red;
}

For security reasons -- specifically, in order to prevent history sniffing -- Chrome limits very strictly what can be done using the :visited selector.

a:visited is not working on mozilla but works fine on IE

The visited style has been removed from Firefox (and most other browsers) in recent versions due to a security issue with it.

The problem is that a malicious web site could work out your browsing history by using it - they would set a visited colour, produce a load of URLs (even hidden ones so the user doesn't know about it), and check their colour. It caused quite a bit of noise in browser security circles a couple of years ago.

The visited feature can be switched back on again in Firefox, by going to the security preferences, but it is disabled by default, and most users will have it switched off.

See here for more info on the problem and how Firefox went about fixing it: http://blog.mozilla.com/security/2010/03/31/plugging-the-css-history-leak/

Chrome doesn't respect a color when link is visited

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

---

Related Topics