Test output will not run - not even an error code

Responsive Web Design>Applied Visual Design>Learn How the CSS @keyframes and animation Properties Work

I have the animation working, but it wont give the option to advance to the next lesson and download the code. The animation runs as it’s supposed to, but the test output does not run in that section and just stays stuck on “running tests”

<style>
div {
  height: 40px;
  width: 70%;
  background: black;
  margin: 50px auto;
  border-radius: 5px;
}

#rect {
  animation-name: rainbow;
  animation-duration: 4s;
}
@keyframes rainbow {
  0% { 
    background-color: blue;
  }
  50% {
    background-color: green;
  }
  100% {
    background-color: yellow;
  }
}
</style>
<div id="rect"></div>
  **Your browser information:**

User Agent is: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.12; rv:88.0) Gecko/20100101 Firefox/88.0.

Challenge: Learn How the CSS @keyframes and animation Properties Work

Link to the challenge:

I’ve edited your post for readability. Please don’t post pictures of code. When you enter a code block into a forum post, please precede it with a separate line of three backticks and follow it with a separate line of three backticks to make it easier to read.

You can also use the “preformatted text” tool in the editor (</>) to add backticks around text.

See this post to find the backtick on your keyboard.
Note: Backticks (`) are not single quotes (’).

thanks - will do next time

I don’t know, it passes for me.

Be careful with things involving color - make sure you don’t have dark mode on.

Barring that, I would reboot, clear your browser cache, or try a different browser.

If none of that works, just back out of this challenge and move onto the next.

2 Likes

yup - backing out of dark mode did it - thank you !

1 Like

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