This is my code so far

Tell us what’s happening:

Media query 

Your code so far


<style>
p {
  font-size: 20px;
}
/* Only change code below this line */
@media(max-height:800px
)
p{ 
: 10px;
}
/* Only change code above this line */
</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 (Linux; Android 7.0; Infinix X572) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/80.0.3987.162 Mobile Safari/537.36.

Challenge: Create a Media Query

Link to the challenge:

What would you like help with?

this is what your missing on:your code
Your p element should have a font-size of 10pxwhen the device height is less than or equal to 800px.

see the example above this line:

/* Only change code below  this line */

Your

p

element should have a

font-size

of 10px when the device

height

is less than or equal to 800px.

That what the test is displaying

It looks like the test is telling you that you are missing part of you syntax.

Your media query is strangely formatted:

@media(max-height:800px
)
p{ 
: 10px;
}

Let’s clean that up a bit:

@media(max-height:800px)
p { 
: 10px;
}

Now, you have : 10px, but you don’t say what is 10px. The test is giving you a hint though as to what needs to be set to 10px. It says

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

So, based on that error message, what should go to the left of the :?

I did it but there still no change

Can we see your new code please?