Reputation: 3081
I am trying to change the color of a link. It is defaulted to blue and I want to override it. I did the following:
#site-links a:link{color:red;}
and in Chrome's Inspect Element that was the style which overrode all other styles. However, the link remained blue. In Firefox, however, the link is now red. How can I fix this?
Upvotes: 0
Views: 158
Reputation: 64164
One way to give higher priority to your rule is stating important in it.
a:link { color: red ! important }
Also, when in Chrome inspector , to better control what is happening, you can force the state of the inspected element
When in the element inspector, go to the top of the "styles" bar in the right pane. There is an option that states:
"toggle element state"
There you can check / uncheck the :visited status
Upvotes: 0
Reputation: 14575
:link
targets specifically a link you have not visited. I'm going to go ahead and assume that in chrome you have visited it. You can fix it by targeting each case as you need it:
a:link { color: red; } /* unvisited link */
a:visited { color: blue; } /* visited link */
a:hover { color: green; } /* mouse over link */
a:active { color: yellow; } /* selected link */
Upvotes: 2