Inheritance of list-style-type property in Firefox (bug in Firebug?)
- by Marcel Korpel
Let's have a look at some comments on a page generated by Wordpress (it's not a site I maintain, I'm just wondering what's going on here). As these pages might disappear in the near future, I've put some screenshots online. Here's what I saw:
Obviously, the list-item markers shouldn't be there. So I decided to look at the source using Firebug. As you can see, Firebug claims that the list-style property (containing none) is inherited from ol.commentlist. But if that's the case, why are the circle and the square visible? When checking the computed style, Firebug shows the list-style-types correctly.
What's the correct behaviour? I just did a quick check in Chromium, whose Web Inspector gave a better view of reality (the list item markers were also displayed in this browser):
According to WebKit, list-style of ol.commentlist isn't inherited, only the default value of list-style-type from the rendering engine.
So, we may conclude that the output of both browsers is correct and that Firefox (Firebug) shows an incorrect representation of inherited styles. What does the CSS specification say?
Inheritance will transfer the
list-style values from OL and UL
elements to LI elements. This is the
recommended way to specify list style
information.
Not much about the inheritance of ol properties to uls. Is Firebug wrong in this respect?
BTW, I managed to let the markers disappear by just changing line 312 of style.css to
ol.commentlist, li.commentlist, ul.children {
When also explicitly defining the list-style of ul.children to none, the markers are not painted. You can have a look at screenshots of Firebug and WebKit's Web Inspector in this case, if you like.
