Hi everyone! I’m trying really hard to pass this final part of my project, however I can’t get my @media query to work. I’ve looked on YouTube, gone through the old lesson but can’t figure out where I’m going wrong.
I’m trying to get the font color to change to red when the height is less than 500px.
Here’s a link to my project (sorry it’s messy, I’ll also take any general advice on setting out code to be most legible).
@media (max-height: 500px) {
header li a, header h1 {
color:red;
}
}
will change the colour of both the h1 and the anchor tags inside the header
Have tested this and it works for me and all tests pass
Also the header element needs to be inside the <body> tag as this is page content. I’ve added a <head> element here - this is where meta data goes.
Also for future reference… I think codepen sorts this automatically so you don’t need to worry about it in this instance but if you were writing html from scratch in an IDE you would need to include the following meta tag inside your head tag for media queries to work: