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

Aaron Walton
Aaron Walton
3,557 Points

List styling question

In the CSS Deep Dive >> List Styles css the following code is used

ul li {
    background: url('marker.png') no-repeat 0 2px;
    padding-left: 35px;
}

li {
    margin-bottom: 1.2em;
}

why the need for the two different rules here? Why does the first rule need the ul before the li?

I agree, both selectors are pointing to every li on the page. Unless there is an ordered list (<ol></ol>) somewhere on page or you anticipate using one. Then the li item selector will select all lis on page regardless of list type.

Yeah, but isn't it just the list items that you need to give the margins to? Could you post a link to the challenge/video.

Aaron Walton
Aaron Walton
3,557 Points

Ah yes I wasn't looking at the code in the context of the entire accompanying page. Your reply prompted me to understand what is going on here thanks.

2 Answers

I missed that Aaron. Thanks

Aaron Walton
Aaron Walton
3,557 Points

Thanks to @Pokki RedSquirrel for cluing me into the answer. The accompanying html file has both ol and ul lists, so the ul li is used to target just the ul list and the margin bottom in the li rule without the ul targets both list types.