Media Query issue

Question

Following along with Allison on the adaptive design video but my media query for screen res 480px or less is not working, I hjave it in the right place at the end of my style.css sheet here it is:
@media screen and (max-width: 480px) {
        .grid1,
        .grid2,
        .grid3,
        .grid4,
        .grid5,
        .grid6,
        .grid7,
        .grid8,
        .grid9,
        .grid10,
        .grid11,
        .grid12 {
            width: 100%;
}
}
none of the grid selectors highlight as they should and sublime doesnt seem to recognize the @media selector at all either. Let me know, thanks.

James Barnett · Answer

Your syntax looks good, however the formatting could use some cleaning up to improve its readability. Check out this demo http://codepen.io/jamesbarnett/pen/nqrFj
> sublime doesnt seem to recognize the @media selector
I'm guessing here, but it seems like the syntax highlighter in sublime text hasn't been updated to include some parts of CSS3.

Dave Cannon · Answer

Hmmm...Looks correct to me..I initially had the same problem but I had left out my second closing curly brace. You have it all it seems. I'd take another look and maybe there's an extra comma or something missing...Wish I could tell ya for sure...Good luck Jon !
DC

Welcome to the Treehouse Community

Looking to learn something new?

Jon Gillam

Jon Gillam

Media Query issue

2 Answers

Dave Cannon

Dave Cannon

James Barnett

James Barnett