Create a Media Query lesson appears bugged

HTML-CSS
1

Tell us what’s happening:

I am on the lesson where I have to create a media query for devices with a height less than or equal to 800px. I wrote the code but got an error when I ran the test. I looked at the hint, which is exactly the same as my code but the test won’t pass.

Your code so far


<style>
  p {
    font-size: 20px;
  }
  
  /* Add media query below */
  @media (max-height: 800px) {
    p {
      font-size: 10px;
    }
  }
</style>
  
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus quis tempus massa. Aenean erat nisl, gravida vel vestibulum cursus, interdum sit amet lectus. Sed sit amet quam nibh. Suspendisse quis tincidunt nulla. In hac habitasse platea dictumst. Ut sit amet pretium nisl. Vivamus vel mi sem. Aenean sit amet consectetur sem. Suspendisse pretium, purus et gravida consequat, nunc ligula ultricies diam, at aliquet velit libero a dui.</p>

Your browser information:

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

Link to the challenge:
https://learn.freecodecamp.org/responsive-web-design/responsive-web-design-principles/create-a-media-query

2

Try restarting the browser maybe, if the code is correct but doesn’t pass it’s usually a temporary bug and you have to keep trying until it does.

3

Ok, I’ll keep trying it, The response I get is " // running tests

Your p element should have the font-size of 10px when the device height is less than or equal to 800px.

// tests completed"

Which is exactly what my code should do.

4

By the way, I’ve used that code to see if the challenge passes and it worked. Forgot to mention that. Could be a browser issue maybe, since the problem doesn’t seem to apply to others, me at least.
You could try switching to another browser and see if the challenge passes there?

5

It’s not a browser issue for me. I just cleared my cache, and also tried in a different browser. Am now getting an error in the test results section. Please see the screenshot.

%23!001_MicrosoftEdge_User_Default_WebNotes_Microsoft-Edge-Web-Notes-Responsiv
%23!001_MicrosoftEdge_User_Default_WebNotes_Microsoft-Edge-Web-Notes-Responsiv1920×985 188 KB

6

Yeah, that’s weird. Not sure how to help you though, because I’m copying the entire code from your first post and it passes the challenge for me. I’ve tested it on latest versions of both Chrome and Firefox(dev edition).

For now, it’s probably best to report the bug in this section: http://forum.freecodecamp.org/c/support and keep doing other challenges until this one works.

7

Same issue when attempting to complete this challenge using Chrome Version 70.0.3538.110 (Official Build) (64-bit).
I managed to complete this on Mozilla Firefox 63.0.3 (64-bit).