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

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

i add an id="bite"

to the div that the image is in, and then i

display:none;

to the id in the media query.

It causes the image to disappear just fine but I cant pass the code challenge....

3 Answers

Colin Marshall
Colin Marshall
32,861 Points

The following code worked fine for me:

@media screen and (max-width: 705px) {
.grid_1,
.grid_2,
.grid_3,
.grid_4,
.grid_5,
.grid_6 {
    width:100%;
} 
#bite  {
  display:none;
  }
}
Colin Marshall
Colin Marshall
32,861 Points

Make sure you put the id="bite" on the image and not the div containing the image. It accomplishes the same thing but I guess in order to pass the code challenge the image itself needs to display:none;

Brandon Harvey
Brandon Harvey
5,709 Points

wow... i was totally thinking of something else. the image display:none property is definitely what you need to be paying attention to. I had to go through video step by step before I noticed that part.

Thanks a million!

I didn't know you could put ids on img tags............. but now i do!

Brandon Harvey
Brandon Harvey
5,709 Points

id's are kind of similar to class's except they are more unique. you can only have one id per element....

Colin Marshall
Colin Marshall
32,861 Points

in addition to only having one ID per element as Brandon Harvey said, there can only be one instance of an ID on a page.

Brandon Harvey
Brandon Harvey
5,709 Points

Make sure that your tags are properly closed. The program was able to read your code and understand what you said, but the answer isn't responding because something is off.... That's really what it sounds like to me.

img src="img/love-at-first-bite.gif" id="bite" alt="Love at First Bite"

works just fine try it

as an alternative you could also try

#intro img { display:none;}