Compiler not working

Tell us what’s happening:
I typed the code correctly the animation is not showing its still static and doesnt animate.i tried reloading.Still the same problem.I thought there is mistake in my code but when I click on run tests it runs the tests and says this challenge is done.

  **Your code so far**

<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 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/90.0.4430.212 Safari/537.36

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

Link to the challenge:

look at the example, keyframes is not inside the css selector

oh i didnt see that since it accepted the code .I thought compiler is not working.I think the task completed verifier is bugged ,because even though I wrote a wrong code it said that challenge is completed.I think it needs to be fixed otherwise other beginners like me may not notice it and continue and go on doing the same mistake.
anyways thanks for that I hope you fix that bug

Thank you for helping make FCC better. Bugs can be reported as GitHub Issues. Whenever reporting a bug, please check first that there isn’t already an issue for it and provide as much detail as possible.

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