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
Zach Turner
1,013 PointsWhy does this not work?
The question was 'Select the list items nested inside the gallery. Float them to the left and set the width to 45%'.
My code:
#gallery li {
float: left;
width: 45%;
}
3 Answers
Jordan Pyne
3,055 PointsTo fix it just use "#gallery" as the selector instead of "#gallery li" as you have used.
I'll try to explain it again. CSS uses specifiers to target the particular elements you want. By targeting an ID such as "#gallery" you are already specifying the CSS to a very specific level. By then trying to specify by saying "#gallery li" you are saying that you want to target the element with the ID of gallery if it is a list item? But there can only be one ID of gallery in a html source code. The source code would have had 'li id="gallery"'. Thus, by selecting gallery you have already selected the only possible element on the page. Hence, the syntax you have used cannot work.
Zach Turner
1,013 PointsI got it, thanks ;)
Jason Anello
Courses Plus Student 94,610 PointsI think you are confusing #gallery li with li#gallery. The second selector would be what you're describing. This would select list items if they had an id of "gallery".
The first selector, #gallery li is a descendant selector. It would select all list items that are within an element whose id is "gallery".
Jordan Pyne
3,055 PointsHi Jason,
Sorry. for future readers you are correct. I was confused between 'li#gallery' and '#gallery li'.
But nevertheless, shouldn't that mean his code was correct? Is it an error on Treehouse's behalf in that it would not accept that answer?
Why would my original (although incorrectly reasoned) suggestion of just using '#gallery' have worked? The HTML must be wrong?
Jason Anello
Courses Plus Student 94,610 PointsHi Jordan,
That's what I'm confused about. Zach's original code did seem to meet the requirements of the question as stated. Presumably your answer somehow fixed it since you have "Best Answer".
The original challenge wasn't linked to so we can't check on it. It's probably from "How to Make a Website" but I don't know for sure.
Maybe Zach Turner can clear this up for future readers?
Jordan Pyne
3,055 PointsHi Zach,
You did not need to include any information regarding the list item. HTML code can only have one ID of "gallery", and so it is unnecessary to further specify by saying li.
This confused the CSS as there should be only one ID of gallery attached to the particular element.
If that does not make sense let me know.
Regards, Jordan.
Zach Turner
1,013 PointsI'm not sure what you mean, what would I have to do to fix it?
Jordan Pyne
3,055 PointsYou're welcome :)
Jason Anello
Courses Plus Student 94,610 PointsJason Anello
Courses Plus Student 94,610 PointsYou didn't link to the challenge but based on what you said the question is, your code should have worked out. Assuming the
ulhad anidof "gallery".