Tell us what’s happening:
Describe your issue in detail here.
Adding background: #00FF; on 50% makes ball’s background color to change
but background-color: #00FF; doesn’t makes difference.
why is this happening?
sorry for my bad english.
thanks
**Your code so far**
<style>
#ball {
width: 100px;
height: 100px;
margin: 50px auto;
position: relative;
border-radius: 50%;
background: linear-gradient(
35deg,
#ccffff,
#ffcccc
);
animation-name: bounce;
animation-duration: 1s;
animation-iteration-count: infinite;
}
@keyframes bounce{
0% {
top: 0px;
}
50% {
top: 249px;
width: 130px;
height: 70px;
<!-- right here -->
}
100% {
top: 0px;
}
}
</style>
<div id="ball"></div>
**Your browser information:**
User Agent is: Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/91.0.4472.101 Safari/537.36
Challenge: Animate Elements Continually Using an Infinite Animation Count
Link to the challenge: