Need assistance in adjust-the-hue-of-a-color [beta]

Challenge Name

adjust-the-hue-of-a-color has an issue.

Issue Description

Hello everyone, I have a problem with one challenge at the beta website: I have tried to pass the test in my main browser (palemoon) but it says:

// running test
"message: The div element with class cyan should have a background-color of cyan."
// tests completed

and fails to complete although the code is correct. Also, I have tried with opera and firefox and, while it passes the tests, it cannot continue to the next challenge, it keeps saying “try again later”.

Browser Information

User Agent is: Mozilla/5.0 (X11; Linux x86_64; rv:3.4) Gecko/20100101 Goanna/20180113 PaleMoon/27.7.0.

Code



<style>
  body {
    background-color: #FFFFFF;
  }
  
  .green {
    background-color: hsl(120, 100%, 50%);
  }
  
  .cyan {
    background-color: hsl(180, 100%, 50%);
  }
  
  .blue {
    background-color: hsl(240, 100%, 50%);
  }
  
  div {
    display: inline-block;
    height: 100px;
    width: 100px;
  }
</style>
  
<div class="green"></div>
<div class="cyan"></div>
<div class="blue"></div>

Interesting. Your code passes in latest Firefox and I’m allowed to continue. I’d suggest you create a new issue here and provide the same details.

Step fails:
I had the exact same issue as in this thread Need assistance in adjust-the-hue-of-a-color [beta]

As a work around, I was able to proceed by adding another background-color: cyan; to the CSS. This seemed to satisfy the “The div element with class cyan should have a background-color of cyan.” portion of the assignment maybe its my 32 bit browser?

Your code so far

<style>
  body {
    background-color: #FFFFFF;
  }
  
  .green {
    background-color: hsl(120, 100%, 50%);
  }
  
  .cyan {
    background-color: hsl(180, 100%, 50%);
    background-color: cyan; //passes with addition of this line.
    // Without adding the second background-color:, 
   // "The div element with class cyan should have a background-color of cyan." 
   // fails Firefox 52.7.3 32bit
  }
  
  .blue {
    background-color: hsl(240, 100%, 50%);
  }
  
  div {
    display: inline-block;
    height: 100px;
    width: 100px;
  }
</style>
  
<div class="green"></div>
<div class="cyan"></div>
<div class="blue"></div>


Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 6.3; WOW64; rv:52.0) Gecko/20100101 Firefox/52.0.

Link to the challenge:
https://learn.freecodecamp.org/responsive-web-design/applied-visual-design/adjust-the-hue-of-a-color

2 Likes

This worked for me thanks

1 Like

After a long time I decided to complete this :slight_smile: . Your solution worked. Thanks @Johnny2136

1 Like