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

HTML How to Make a Website Responsive Web Design and Testing Write CSS Media Queries

CSS Media queries

After the first breakpoint, create a second breakpoint for devices 660 pixels wide or larger. Inside the breakpoint, set the body background to the color darkgreen.

@media screen and (min-width: 660px) { body { background: darkgreen; } }

How come it's not accepting my code? I've tried everything...or so it seems.

10 Answers

Hmm...this is baffling. It seems like the code is not recognizing your second query at all. Make sure you properly closed the first media query before starting the second one. So for instance, there should be two closing curly braces before the second query starts.

Try using the css property background-color.

@media screen and (min-width: 660px) { 
body { background-color: darkgreen; } 
}

I just recently completed this code challenge. The code you posted seems to be correct to me. I went back to this challenge to copy/paste what you posted and it passes for me. Have you checked to see if there is a stray character floating around in your file somewhere? Here's what I used:

@media screen and (min-width: 660px){
    body{
    background: darkgreen;
  }
}

I checked my code for stray characters and there aren't any. It still won't pass me. I also tried background-color all to no avail.

What's the error that you are getting?

Kevin Enloe
Kevin Enloe
12,438 Points

Just a random guess but maybe it is not passing you because you are not indenting it.............maybe try that because the code does look correct.

Martin Granger

@media screen and (min-width: 660px) { body { background-color: darkgreen; } }

Bummer! Did you change the background color to darkgreen for devices larger than 660px?

Grrrrr....

Hmm...this is baffling. It seems like the code is not recognizing your second query at all. Make sure you properly closed the first media query before starting the second one. So for instance, there should be two closing curly braces before the second query starts.

Martin Granger

Boomshakkalokka. Adding a second set of curly braces after the first media query worked! Thanks chief!

Haha anytime! Glad to assist!