Welcome to the Treehouse Community

The Treehouse Community is a meeting place for developers, designers, and programmers of all backgrounds and skill levels to get support. Collaborate here on code errors or bugs that you need feedback on, or asking for an extra set of eyes on your latest project. Join thousands of Treehouse students and alumni in the community today. (Note: Only Treehouse students can comment or ask questions, but non-students are welcome to browse our conversations.)

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and a supportive community. Start your free trial today.

CSS Build a Responsive Website Responsive Design Content Defined Breakpoints

wendy higgins
wendy higgins
731 Points

Stage 4, Challenge Task 2, can't make img disappear via CSS - how to? Thanks

Stage 4, Challenge Task 2, can't make img disappear via CSS - how to? Thanks

What do you mean? theres not much info thats useful for students , moderators or staff to help you. It would be good if you: Link the the course | Post CSS | Explain what you mean

That would be great resource to try and help you .

wendy higgins
wendy higgins
731 Points

Sorry, here is css/media query:

@media screen and (max-width:705px)
{
.grid_1{width:100%;}
.grid_2{width:100%;}
.grid_3{width:100%;}
.grid_4{width:100%;}
.grid_5{width:100%;}
.grid_6{width:100%;} 
.grid_2 .omega img {display:none;}
 }

Any ideas what's not correct?

Wayne Priestley
Wayne Priestley
19,567 Points

Yep, just remove the grid_2 and it will work, you were right with omega thats enough to identify the target img,

BTW Wendy, there is no need to have .grid_1{width:100%;} .grid_2{width:100%;} Remove all the {width:100%;} and just use it once at the end, like so:

@media screen and (max-width: 705px){
  .grid_1, 
  .grid_2,
  .grid_3,
  .grid_4,
  .grid_5,
  .grid_6{
     width: 100%;
  }

For better pasting code like this

var codeHere

i know this is not related but Wayne, do you know any website or something that gives all code that makes to write anything on forum eg bold bullet points etc?

2 Answers

wendy higgins
wendy higgins
731 Points

Thanks for your help, Wayne - I think I'm actually squared away...for the moment ;) Wendy

Wayne Priestley
Wayne Priestley
19,567 Points

Hi Wendy,

To make the img disappear you need to use the display property, so what you need to do to pass this challenge is to target the img.

I'm trying not to give the answer direct but if you look at the html that has the "love at first bite" img in it has two things in the div class, the first is the grid and the second is something we can use to identify where our img is, now if you use that, then img then your curly brackets, then your display property.

Job done :)

I've kinda beaten around the bush a bit trying not to give the direct answer, but if you have any problems at all following along with what I've said just let me know and i'll help out a bit more.

wendy higgins
wendy higgins
731 Points

Thanks, Wayne! Just posted my css above, which sort of looks like what you hinted at - but what's not right (since it's not being "approved")?

Wayne Priestley
Wayne Priestley
19,567 Points

Hi Wendy,

I just updated my answer above for you, hope it helps.