CSS: "Active learning: Styling a nested list"

See: https://developer.mozilla.org/en-US/docs/Learn/CSS/Styling_text/Styling_lists#Active_learning_Styling_a_nested_list

For “Active learning: Styling a nested list”, when setting list-style-type: the answer is to set the declaration to ul li or ol li and not just on the ordered list or unordered list, ol {}.

Is the reason for doing this greater ‘specificity’ or can I can set the declaration on the <ul> or <ol>? This has tripped me up in the past.

Thanks for helping my understanding.

1 Like

I honestly don’t think it matters where you use it. I’d say putting list-style-type on the list as opposed to the items makes more semantic sense, as it affects the whole list.

But I can see that my examples were inconsistent, which probably led to your confusion. I’ve updated them all to be set on the list, not the list items.

1 Like