Inheritance of list-style-type property in Firefox (bug in Firebug?)

Posted by Marcel Korpel on Stack Overflow See other posts from Stack Overflow or by Marcel Korpel
Published on 2010-04-14T03:10:44Z Indexed on 2010/04/14 3:12 UTC
Read the original article Hit count: 369

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:

Screenshot of comments, together with the nifty little Firebug thing

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):

View of Chromium's web inspector showing the same page

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.

© Stack Overflow or respective owner

Related posts about css

Related posts about css-inheritance