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

confusing selecting html with css

I am confused with how to properly select html in css for some time now:

for example:

why in this video you use this:

gallery li {

width: 28.3333%; }

not this:

#gallery li a{ width: 28.3333%; }

2 Answers

Hi Pawel,

I can't see your code to specifically explain why you would use one over the other, but the difference between the two lines of code you put in your question are this:

This code selects the (LI) list item within the element that has an id of "gallery" (my guess is the gallery is a UL)

gallery li {width: 28.3333%; }

This code selects the a (link) within the (LI) list item within the element that has an id of "gallery".

gallery li a{ width: 28.3333%; }

Hope this helps! Keep coding!

Hi Pawel, I cant see the video you refer to but: When you write CSS with a #gallery li, it looks in your HTML for a id="gallery" and then for the list items within that id. If your CSS begins with a .gallery li, it will look for a class="gallery" and the list items in that class. If your CSS just begins with gallery li (without a # or .) then it will look for the li within an actual tag.