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

Foundations of CSS problem

I am stuck on this,

Add the appropriate CSS code to the media query so that images within the ".cupcake" div disappear when the device or browser width is at most 480px wide.

Any help on the proper code?

David Lane
David Lane
33,414 Points

What code do you have so far? This will help us figure out what your doing wrong.

5 Answers

Elliott Frazier
PLUS
Elliott Frazier
Courses Plus Student 9,647 Points

We wont be able to help unless you show us your code so we can see what you've done wrong.

David Lane
David Lane
33,414 Points

You should be looking for something like this:

@media screen and (max-width: 480px) {
    .cupcake {
        display: none;
    }
}

That's exactly the code I have and it is returning this error : "Bummer! This image is still visible even when the device width is less than 480px".

By the way, how do you do the screen grab of the code?

David Lane
David Lane
33,414 Points

After re-reading the question, try changing the CSS selector to:

.cupcake img { dispay: none; }

As far as posting code, check out the "Markdown Cheetsheet" underneath the answer box. It explains how post code.

Thanks a lot. It worked. I swear I tried that, but apparently not.