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


media queries:making an image within div dissapear upon a max screen size

guess first i assign the max to be 480px.

the im not sure how to referance images in a div or if {display:none:} is correct command

@media screen and (max-width : 480px) { .divname or #imgname {display:none;} }

Chris Scott
Chris Scott
7,673 Points

If the Screen Size is less than 480px any img tag is not displayed.

code redacted

Keep in mind the image is still loaded by the browser just not displayed. If your goal is to minimize the page load for mobile, using Javascript to detect the screen size and loading in a smaller version in it's place is the better practice.

James Barnett
James Barnett
39,199 Points

Chris Scott -

I've removed your code. Here on the forum we try to not just provide someone with the answer, instead explain the process, and help guide them through understanding the problem.

Remember our goal here on the forum is give help not answers. Need more explanation on the distinction check this out.