Learn Accessibility by Building a Quiz - Step 46

The actual issue I am having is, every time I input the specified color for :hovered items and click “check my code” button, the instruction changes to show the required color now being a different color, and when I change the color to the newly specified color, the instruction changes again and tell me I have to input the original color again, which then causes it to continue this bizarre action of changing the required input back and forth between color: #dfdfe2; and color: #1b1b32 endlessly for all of time.
I have also tried changing

nav > ul > li:hover 

to

nav li:hover

to no avail.

Your code so far

nav > ul > li:hover {
	color: white;
	background-color: #1b1b32;
	cursor-type: pointer;
}

li > a {
  color: #dfdfe2;
	text-decoration: none;
}

Your browser information:

User Agent is: Mozilla/5.0 (X11; Ubuntu; Linux x86_64; rv:102.0) Gecko/20100101 Firefox/102.0

Challenge: Learn Accessibility by Building a Quiz - Step 46

Link to the challenge:

1 Like

after some more messing about with each line, deleting each color and background attribute, verifying code between each, I then added the specified colors back in (still between “check my code” verifications) and lo and behold, the code passed.
Here is the working code submission.

nav li:hover {

background-color: #dfdfe2;

color: #1b1b32;

cursor: pointer;

}

li > a {

color: #000000;

text-decoration: none;

}
1 Like

and here is the autocorrected version after submitting and moving to step 47

nav > ul > li:hover {
  background-color: #dfdfe2;
  color: #1b1b32;
  cursor: pointer;
}

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

Thank you for this. I had the exact same back and forth.

1 Like

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