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
anglabels
Courses Plus Student 2,827 Pointsweb design: Stage 8 / Task 1
why doesn't work: @media screen and (min-width: 480px) {
gallery li {width: 28.3333%;}
}
4 Answers
Erik McClintock
45,783 PointsThat code is correct.
The only other possibility that I can think of is, are you creating the media query yourself? Down at the very bottom of the CSS file, there already exists the media query, which is where they want you to write your code.
Otherwise, if I copy and paste your code into the challenge, it works just fine.
Erik
Erik McClintock
45,783 PointsAnglabels,
You need to remember to put the pound sign/hash before the gallery selector, as 'gallery' is the ID. So, you want this:
@media screen and (min-width: 480px) {
#gallery li {
width: 28.3333%;
}
}
Happy coding!
Erik
anglabels
Courses Plus Student 2,827 PointsThank you for the quick answer! It still doesn't work... :(
So the task is: "Inside the media query, select the list items inside the gallery and add a width of 28.3333%."
and I wrote: @media screen and (min-width: 480px) { #gallery li { width: 28.3333%; } }
Can you recognize the mistake? Thanks!
anglabels
Courses Plus Student 2,827 PointsUh! Thank you! This was hard :)
Erik McClintock
45,783 PointsMy pleasure! Glad to have helped get you back on track :)
Happy coding!
Erik
Erik McClintock
45,783 PointsErik McClintock
45,783 PointsTo clarify: do NOT write your own media query; insert your code (#gallery li { width: 28.3333%; }) into the pre-existing media query at the bottom of their CSS file.