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 Build a Responsive Website Responsive Design Content Defined Breakpoints

wendy higgins
wendy higgins
731 Points
Posted by 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

Aurelian Spodarec
Aurelian Spodarec
7,369 Points

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
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,579 Points
Wayne Priestley
Wayne Priestley
19,579 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%;
  }
Aurelian Spodarec
Aurelian Spodarec
7,369 Points

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
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,579 Points
Wayne Priestley
Wayne Priestley
19,579 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
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,579 Points
Wayne Priestley
Wayne Priestley
19,579 Points

Hi Wendy,

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