Failure instead of Pass

HTML-CSS
1

Tell us what’s happening:
This Error coming everytime i click “Run The Tests”.
// running tests The

keyframes

rule for fade should set the

opacity

property to 0.1 at 50%. // tests completed

And that too even after I completed it correctly and successfully

Your code so far


<style>

#ball {
  width: 70px;
  height: 70px;
  margin: 50px auto;
  position: fixed;
  left: 20%;
  border-radius: 50%;
  background: linear-gradient(
    35deg,
    #ccffff,
    #ffcccc
  );
  animation-name: fade;
  animation-duration: 3s;
}

@keyframes fade {
  50% {
    left: 60%;
    opacity : 0.1 ;
  }
}

</style>

<div id="ball"></div>

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/80.0.3987.122 Safari/537.36.

Challenge: Create Visual Direction by Fading an Element from Left to Right

Link to the challenge:
https://www.freecodecamp.org/learn/responsive-web-design/applied-visual-design/create-visual-direction-by-fading-an-element-from-left-to-right

2 
@keyframes fade {
  50% {
    left: 60%;
    opacity : 0.1 ;
  }
}

Why the space before the 0.1? That’s throwing off the test. Should it throw off the test? No. But it does. They are probably parsing the code as text and they didn’t account for people adding a space there. Most people wouldn’t.

1 Like