Learn Accessibility by Building a Quiz - Step 47

HTML-CSS
1

You should give hovered li elements a background-color of #dfdfe2

li > a {
  color: inherit;
  text-decoration: none;
  hover: 
}

li {background-color: #dfdfe2;
}

As far as I can tell I did exactly that and the li elements are shaded in the output. I must be missing something…

Thanks for taking a look at what I’m doing…

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/113.0.0.0 Safari/537.36

Challenge: Learn Accessibility by Building a Quiz - Step 47

Link to the challenge:

2

You have to use a pseudo selector to apply the styling when you hover the cursor.

So, you can use element:action (or something like this). One way you could do this is by using this selector: nav > ul > li:hover then apply the style you want with the cursor property pointer, like cursor: pointer;

I hope I was of some assistance! God bless you!

Edit: you have to use the nav > ul > li:hover because you may have other li elements and you want to style a specific one.

1 Like
3

So I re-wrote it like this …

  cusor: pointer;
  color: #1b1b32;
  background-color: #dfdfe2;
}```

Still getting this error message. You should give hovered li elements a background-color of #dfdfe2 which I think that I did...?

not sure where I went wrong...
4 
li > a {
  color: inherit;
  text-decoration: none;
  background-color: #dfdfe2;
}

nav > ul > li:hover {
  color: #1b1b32;
  cursor: pointer;
}```

This is what I have now. I'm still getting the same error message.
5
  • Where did you find the instruction to add the ‘background-color’ property to the anchor elements?
  • When you hover over the li elements (it is a new selector: nav > ul > li:hover), their ‘background-color’ property value should change to the value of ‘color’ property found in the selector nav > ul > li, and ‘color’ property’s value should change to the value of ‘background-color’ property of the ‘header’ selector (found almost at the top of your css file) .
1 Like
6

Got it. Thank you…had too many edits going . Started over and followed your post and the hints…

Thank you !

1 Like
7

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.