Not signed in (Sign In)
SkillShare - A place to discuss Web Standards and Web Design topics
Categories
Vanilla 1.1.9 is a product of Lussumo. More Information: Documentation, Community Support.
- Friends
-
My CSS rule for #sidebar has property list-style-type: none. I want to know why UL element doesn't want to inherit first property from #sidebar? I read on the net that list-style-type property is inherited so why it doesn't want to apply to UL then? My 3 list items still have bullet points. On other hand it applied red color for text which is second property in #sidebar.
My simple code is below:
#sidebar {
list-style-type: none;
color:#F00;
}
<body>
<div id="sidebar">
<ul>
<li>Item1</li>
<li>Item2</li>
<li>Item3</li>
</ul>
</div>
</body>
I can fix it in many ways but could somebody explain me why it doesn't work with #sidebar and which from examples below is the best. I really want to understand CSS not just fix it without knowing why it didn't work in the first place.
ul {
list-style-type: none;
}
or
li {
list-style-type: none;
}
or
#sidebar ul {
list-style-type: none;
color:#F00;
}
or
#sidebar li {
list-style-type: none;
color:#F00;
} -
#3.
Applying list-style-type: none; to the #sidebar containing element means nothing, because #sidebar is not a list.
The inheritence comes only from if you define the list-style in #sidebar ul or ul, and the list elements (li) will inherit from there.
1 to 2 of 2