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:
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-type
s 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 ul
s. 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