I'm new on CSS and trying to understand how links are modified due to the changed state. On my scenario, I want to change the text-decoration to the line-through when the link is on visited state. However, neither on Mozilla nor Chrome browser, text-decoration of the text content not updated with line-through when the link is on visited state, shown as below. Where did I go wrong?
Please notify that the color is updated (to green) when the link state changed to visited while the text-decoration stays the same (see. Demo #1);
Note: There is a bug report for the Mozilla about the same issue: Mozilla Bug #645786 and on the bug report. Problem also reproduce for the tag.class:state selector (a.:visited) (see Demo #2)
Demo #1
<!DOCTYPE html>
<html>
<head>
<style>
a:link {
color: red;
text-decoration: none;
}
a:visited {
color: green;
text-decoration: line-through;
}
a:hover {
color: blue;
}
a:active {
color: yellow;
}
</style>
</head>
<body>
<p>
<b>
<a href="http://google.com" target="_blank">This is a link</a>
</b>
</p>
</body>
</html>
