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!

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



I am confused in @media can I write all my CSS inside it or I should select CSS class and write

2 Answers

Hey Sworup, media queries are usually placed at the end of every css file to override all other rules.

Unless it is for something specific you would never place it at the top.

Hi Sworup,

Not quite sure if I fully understand your question but I will give it a try :).

First of all you always want to add your code for your media query at the end of the CSS file. You start with they keyword @media and add parentheses (). Between the parentheses you will specify when the CSS rules that you write in your media query will be applied to the style of your document. In the example below that I set it to (max-width: 600px) which means when the browser window is smaller than 600px it will apply the styles that you wrote in your CSS. in this case it will style the body element and change the background-color to lightblue.

Furthermore, you can target every element withing your media query. For example # to target ID or . to target a class etc..

@media (max-width: 600px) {
    body {
        background-color: lightblue;

can I add media query at first of my CSS file after box sizing