Basic CSS-Tests seem to be bugged

Basic CSS-Tests seem to be bugged
0

Tried doing the CSS Basic challenges:

Change your h2 element’s style so that its text color is red.
With my solution:

<h2 style="color: red;">CatPhotoApp</h2>

Testoutput: Your h2 element should be red.
While the visual on the right is clearly red.

Browser: Chrome - Version 74.0.3729.169
Windows 10.

I tried using Edge (test wont run at all), deleting Cookies and Cache, restart and reload.
And other CSS-Challenges down the line (in Chrome)=> same issue

I think this is probably related to
#12677
#10595
and others but as a new user i can only link two so ill link the main ones.

Hi, welcome to the forum.

Your solution works for me, on linux/chrome. Of course, I have to guess which challenge you’re on.

Please provide a link to the challenge and the complete code to your solution.

You’re right that browser can make a difference. I wouldn’t even try Edge. Start with Chrome and try FireFox. Like you mentioned, clearing out the cache, trying a different browser can help.

And remember that not every challenge is required. If you can’t get it to work, and are sure you understand it, just move on.

Full Code below.
Found the bug in:

  • Change the Color of Text
  • but it also happens in the next few challenges

https://learn.freecodecamp.org/responsive-web-design/basic-css/change-the-color-of-text

<h2 style="color: red;">CatPhotoApp</h2>
<main>
  <p>Click here to view more <a href="#">cat photos</a>.</p>
  
  <a href="#"><img src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back."></a>
  
  <div>
    <p>Things cats love:</p>
    <ul>
      <li>cat nip</li>
      <li>laser pointers</li>
      <li>lasagna</li>
    </ul>
    <p>Top 3 things cats hate:</p>
    <ol>
      <li>flea treatment</li>
      <li>thunder</li>
      <li>other cats</li>
    </ol>
  </div>
  
  <form action="/submit-cat-photo">
    <label><input type="radio" name="indoor-outdoor" checked> Indoor</label>
    <label><input type="radio" name="indoor-outdoor"> Outdoor</label><br>
    <label><input type="checkbox" name="personality" checked> Loving</label>
    <label><input type="checkbox" name="personality"> Lazy</label>
    <label><input type="checkbox" name="personality"> Energetic</label><br>
    <input type="text" placeholder="cat photo URL" required>
    <button type="submit">Submit</button>
  </form>
</main>

Do you have an extension for dark mode? That can make the tests not pass

ohhhhh thats it. => tried it out it works now.
curious. I know it changes the CSS on my side but the code i pass on to the test should be unchanged.
I wonder why that happens:thinking:

But thanks a lot!
Ill continue through the Tests.

Well, the tests are done on the browser… if something on the browser change things, like for example the zoom in challenges that are about the size of things, the tess can not pass