Media Queries

Media queries have to go at theĀ endĀ of your CSS file. If your project has a #wrapper with a width of 960px, for example, you’d want to use a media query like this:

@media all and (max-width: 959px) {

/* media query rules go here */

}

In this case, the rule you’d probably want to put inside your media query would be:

#wrapper {

width: 90%;

}

So the end result would look like this:

@media all and (max-width: 959px) {

#wrapper {

width: 90%;

}

}

To see if your media query works, resize your page to under 960 pixels and see if your text wraps.

This entry was posted in Uncategorized. Bookmark the permalink. Follow any comments here with the RSS feed for this post. Both comments and trackbacks are currently closed.