Creating a Media Query

HTML-CSS
1

Tell us what’s happening:
I’ve tried multiple browsers and I still can’t get this code to run. The syntax all looks correct. Is there something I’m missing?

Your code so far


<style>
	p {
		font-size: 20px;
	}
	/* Add media query below */

	@media (max-width: 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; rv:61.0) Gecko/20100101 Firefox/61.0.

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

2

You set width…the ask is:

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

1 Like
3

Thanks Tirjasdyn, I caught this later when reading the instructions again a couple of times.