Create a Media Query error

HTML-CSS
1

Tell us what’s happening:
I don’t know why I get an error. When I did everything as it was shown in the lesson, nothing worked for me at all, then I started skating media queries in google and found how to write correctly.
This does not work:
@media (min-height: 800px;) {
p {
font-size: 10px;
}
}
it works, but only 50%:
@media (min-device-height: 800px) {
p {
font-size: 10px;
}
}

Your code so far


<style>
  p {
    font-size: 20px;
    
  }
   @media (min-device-height: 800px) {
      p {
       font-size: 10px;
      }
    } 
   /*  @media (min-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 AppleWebKit/537.36 (KHTML, like Gecko) Chrome/74.0.3729.131 Safari/537.36.

Media%20query
Media%20query1060×609 175 KB

2

Hey @CyberDed

You have been using min-height to solve the objective. But see the example below and understand.

Ex - @media(max-width:800px) . Using this media query will only reflect if the viewport is less or equal to 800px
Where as the same applies below also, but it requires a minimum width of 800px to reflect.
@media(min-width:800px).

The same applies for max-height and min-height.

3

I did not understand the material of the lesson correctly, but now I understood and was able to pass this test.
thanks a lot!