441946 - font styles in nested lists do not render correctly

Status: VERIFIED INVALID

(Firefox :: General, defect)

Description

[Mike Ritter]

User-Agent:       Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.9) Gecko/2008052906 Firefox/3.0
Build Identifier: Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.9) Gecko/2008052906 Firefox/3.0

When styling for unordered lists nested within a parent list item I expect the settings for the nested item to override those of the parent, but they do not in FF3, works as expected (Gasp!) in IE7.

EXAMPLE:

UL
 LI
 LI
  UL
   LI
   LI
    UL
     LI
     LI
    /UL
   LI
  /UL
 LI
/UL

EXAMPLE CSS

ul li {font-weight:bold;}

ul li ul li {font-weight:normal}

ul li ul li ul li {font-style:italic}

Reproducible: Always

Steps to Reproduce:
1.
2.
3.
Actual Results:  
Nested list inherits parent's attributes

Expected Results:  
Attributes for child list should override parent's attributes

Comment 1

[John Daggett (:jtd)]

Mike, could you attach a testcase that illustrates this problem, one that renders in FF3 and IE as you describe?

Comment 2

[Mike Ritter]

See  http://mikeritteronline.com/nestedlist.html

Comment 3

[philippe (part-time)]

(In reply to comment #2)
> See  http://mikeritteronline.com/nestedlist.html

That construction is invalid html 4
The nested ul has to be included inside the li, like so:
..
<li> aaa </li>
<li> xxx
<ul>
<li>nested</li>
</ul></li>
<li>yyy</li>

And those closing </a> shouldn't be there, but that is unrelated to the issue.

Comment 4

[philippe (part-time)]

Attachment: valid example

based on http://mikeritteronline.com/nestedlist.html

valid example, works correctly in all browsers

Comment 5

[Mike Ritter]

My apologies for the bad code. Great work tracking it down Philippe.