Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

CSS CSS Layout CSS Media Queries Targeting Media Features

Posted by Debashri Mishel Dutta
Debashri Mishel Dutta
2,047 Points

The footer list is not changing its size when I expand the viewport

I'm not sure what's happening but I've done the @media screen and (min-width: 720px) exactly as it's given in the video but the ul li doesn't change when I expand the viewport. Any suggestions are welcome. Thanks.

kevin N.A
kevin N.A
7,391 Points
kevin N.A
kevin N.A
7,391 Points

You might just need to double check the curly brackets.

3 Answers

Unsubscribed User
Unsubscribed User
7,943 Points

The issue is that in a future lesson they added the "meta=viewport", which we didn't have in our HTML yet (and probably they added it before this lesson was recorded and simply forgot to also mention it during the lesson). So just add this line inside your <head> section, under <meta charset="UTF-8">, in order to have media queries work properly: <meta name="viewport" content="width=device-width, initial-scale=1">

You'll also get the explanation of what this is in the next video.

Jessica Hernandez
Jessica Hernandez
2,485 Points
Jessica Hernandez
Jessica Hernandez
2,485 Points

I had the same problem, check that there is no ; at the end of (min-width: 730px). That was my issue.

Emerson French
seal-mask
.a{fill-rule:evenodd;}techdegree
Emerson French
Front End Web Development Techdegree Student 4,125 Points
Emerson French
.a{fill-rule:evenodd;}techdegree
Emerson French
Front End Web Development Techdegree Student 4,125 Points

I might have something.

  1. What browser are you using? 2.Are you using a mobile emulator? 3.Did you check your code for typos?

Solution to the same problem for me.

  1. Vivaldi for browser. 2.Don't use mobile emulator, just stick with the dev tools. 3.Went back and found a few typos. Best of luck. -Emerson