@media: not working for me

HTML-CSS
1

Tell us what’s happening:
this is the code, i put it in just as the video said
/* Only change code below this line */

@media (max-height: 800px);

p {

font-size: 10px;

}

Your code so far


<style>
p {
  font-size: 20px;
}

/* Only change code below this line */
@media (max-height: 800px);
p {
font-size: 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 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/85.0.4183.83 Safari/537.36 Edg/85.0.564.44.

Challenge: Create a Media Query

Link to the challenge:

3

i understand that ! BUT when i put it in like that it kicks it out the media is correct it’s kicking the font-size

4

the media is supposed to be like this and not have a semi-colon as above:

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

you may want to rewatch the video more carefully, the code used in the video is not the same used by you

6

ok so as i said i put it in like this @media(max-height:800px) p{font-size10px:}

@media checks out font-size 10px; does not

7

thank you I copied yours and it worked ! Still don’t know what was wrong with mine, but I think it was the placement of the brackets

8

Yours does not have the { }covering the nested p css,
@media(max-height:800px) p{font-size10px:} (WRONG)

@media(max-height:800px) {
p{font-size10px:}
}