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

Code Challenge > Responsive design: Content Defined Breakpoints Task 2/3

Add the appropriate CSS within the same media query that will force the “love at first bite” illustration to disappear.

If I use the following code the test will let me pass but all images are removed:

@media screen and (max-width: 705px) {


    img {
        display: none;
    }
}

If I give the image an id (in html) and declare it in the media query, the task won't let me pass.

IWhat am I doing wrong?

Thanks in advance

6 Answers

@Andrew -

The key to this is to look at the html, and take note ...

  • The image is inside of the intro div.
  • It's the only image inside of that div.

If you click the refresh preview button in the code challenge and then resize your browser until it's less than 705px wide the illistration will vanish.

The reason for this is that the code challenge's preview function is actually using your own browsers media queries, so it won't actually hide the images until you your viewport size is less than 705px wide.

Hey Andrew!

I hope James's solution worked for you. If you still encounter problems email me directly :) help@teamtreehouse.com

Cheers!

Elizabeth

@James Thank you so much!

@Elizabeth Will do

@Andrew - You're very welcome. Let us know in this thread if you've got anymore questions.

@James

Ok, it isn't the first time you bailed me out. Your a lifesaver!

Thanks again

@Andrew - Always glad to help out.