Where i did rong helpl me please

Tell us what’s happening:

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% {
  back-ground:blue;
}
  50% {
    back-ground:green;
}
100% {
  back-ground:yellow;
}
}
  
  



</style>
<div id="rect"></div>

Your browser information:

User Agent is: Mozilla/5.0 (Linux; Android 9; SM-A105F) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/76.0.3809.132 Mobile Safari/537.36.

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

Link to the challenge:

and set the background-color

your code says: back-ground:yellow;

Is that the right way?

https://www.w3schools.com/cssref/pr_background-color.asp

  #rect {
    animation-name: rainbow;
    animation-duration: 4s;

  }
@keyframes rainbow{
  0%{
    background-color:blue;
  }
  50%{
    background-color:green;
  }
  100%{
    background-color: yellow;
  }
}

check your background-color property please.

It is great that you solved the challenge, but instead of posting your full working solution, it is best to stay focused on answering the original poster’s question(s) and help guide them with hints and suggestions to solve their own issues with the challenge.

We are trying to cut back on the number of spoiler solutions found on the forum and instead focus on helping other campers with their questions and definitely not posting full working solutions.

Thank you for understanding.

1 Like

My bad, I will be careful from now