Adjust the Hover State of an Anchor Tag

Adjust the Hover State of an Anchor Tag
0

#1

Tell us what’s happening:

The anchor tag color should remain black, only add CSS rules for the :hover state.
The anchor tag should have a color of blue on hover.
// tests completed

Your code so far

a :hover{ color:#000; color: blue; }

CatPhotoApp


<style>
  a {
    color:#000;
  }
  
  
  
</style>
<a href="http://freecatphotoapp.com/" target="_blank">CatPhotoApp</a>

Your browser information:

User Agent is: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_4) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/66.0.3359.181 Safari/537.36.

Link to the challenge:
https://learn.freecodecamp.org/responsive-web-design/applied-visual-design/adjust-the-hover-state-of-an-anchor-tag


#2

You can only have one for each property in a block. So you can’t have two color props.

Take a look a the examples lower in this page to guide you https://developer.mozilla.org/en-US/docs/Web/CSS/:hover


#3

thx Mr.mendez :slight_smile: , i’m going right now to the link


#4
a { color:#000; } a :hover { color: blue; }

CatPhotoApp


#5

it still does’nt work


#6

Hi @marouane1987,

You should put your hover inside style tag <style> </style> like this:

<style>
  a {
    color: #000;
  }
  
  a:hover{
    color:blue;
  }
  
</style>

Good luck and have a happy coding.

Regards,
Ali Mosaad


#7

You have a space between the a and :hover, and you must not


#8

it does’nt work , maybe it’s a bug in the website ??

a { color: #000 ; } a:hover { color: blue ; }

CatPhotoApp


#9

it’s ok , it works now thx everybody


#10

Good luck @marouane1987 and have a happy coding.


#11

image
[/quote]

Hello. Sorry, but this is so simple and I cannot see what am I doing wrong.


#12

add this below the existing CSS code:

a:hover {
          color: red;
      }

#13

It apparently worked when I reloaded the page.


#14

not working for me, is this a bug ?