Click here to Skip to main content
15,886,806 members
Please Sign up or sign in to vote.
0.00/5 (No votes)
See more:
I want my anchors to turn yellow when I hover over them but it isn't working.

What I have tried:

<style>
  a:hover {
    color: yellow;
    }
</style>

<body>
<a href="https://##redacted##.com/" target="_blank">Click Me</a>
</body>
Posted
Updated 18-Aug-21 4:27am
v2

1 solution

It works fine for me when I test it in isolation: JSFiddle - Code Playground[^]
I copy and paste your code and sure enough, I hover, it's yellow. I unhover, it's blue.

Check the rest of your css code and see if anything else is affecting it.
 
Share this answer
 
v2
Comments
Dave Kreskowiak 18-Aug-21 10:47am    
Does that still work after you've clicked the link, then returned to the test page, and hovered over the link again?
Richard Deeming 18-Aug-21 10:54am    
Yes.
Sam Frydman 2021 21-Aug-21 11:08am    
In response to OriginalGriff's suggestion, I don't see anything else in my CSS that could be affecting it. Just to be sure, I created a new html document using only the following code - absolutely nothing else - and the hover still isn't working.

<!DOCTYPE html>
<html lang="en">
    <link href="https://fonts.googleapis.com/css?family=Lobster" rel="stylesheet" type="text/css">
    
    <style>
        a:hover {
            color: yellow:
        }
    </style>
<head>

</head>
<body>
    <a href="https://freecatphotoapp.com/" target="_blank">Click Me</a>
</body>
</html>
OriginalGriff 21-Aug-21 11:54am    
What browsers did you test it on?

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900