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 Unused CSS Stages Media Queries Media Features and Media Types

Mel Warhol
PLUS
Mel Warhol
Courses Plus Student 7,859 Points
Posted by Mel Warhol
Mel Warhol
Courses Plus Student 7,859 Points

Media Features and Media Types

Trying to follow along with this deep dive, but the media queries just don't seem to render in any of the browsers :/...not sure why.

here's the code snippet:

@media screen and (max-width: 768px) {
    body {
      background: #ff6347;
      color: #fff;
  }

}

@media screen and (max-width: 480px) {
  body {
  background: #4682b4;
  }
}
Mel Warhol
Mel Warhol
Courses Plus Student 7,859 Points
Mel Warhol
Mel Warhol
Courses Plus Student 7,859 Points

if it helps..I tried everything in codepen and it worked! Any reason why its not working in my mozilla and chrome browsers? They're both updated versions

3 Answers

Jason Anello
PLUS
Jason Anello
Courses Plus Student 94,610 Points
Jason Anello
Jason Anello
Courses Plus Student 94,610 Points

Hi Mel,

Well, if it worked in codepen then technically it's working in whatever browser you were using when on the codepen site.

Is this css snippet from a full css text file that you have on your computer? There must be something different from what you have in your files vs. what you put in codepen.

It would help to share the codepen link.

So you don't see the background colors when you have your browser width set below 769px?

Mel Warhol
PLUS
Mel Warhol
Courses Plus Student 7,859 Points
Mel Warhol
Mel Warhol
Courses Plus Student 7,859 Points

Hi Jason,

Exactly--I'm unable to see the background colors when I go to preview. Here's the link to what I was working on

http://codepen.io/anon/pen/AbFhk

Mel Warhol
PLUS
Mel Warhol
Courses Plus Student 7,859 Points
Mel Warhol
Mel Warhol
Courses Plus Student 7,859 Points

It's the exact same code I used in the workspace--all I did was copy and paste