:hover not applied to nested elements (li:hover li:hover li)

[GoogleCodeExporter]

Steps to reproduce the problem:
1. HTML: ul li ul li ul li
2. CSS li:hover li, li:hover li:hover li { display: block }
3. Hover over li li.

Expected output:
On modern browsers, nested list elements appear when hovering over their
ancestor.
In IE however, items 1.3.1, 1.3.2 or 1.3.3 never show up.

Version of the product:
svn/version/2.0(beta3)/IE7.js
Operating system:
IE 6.0.2900.2180.xpsp_2gdr

Comments:
It seems that hovering is not triggered for elements when their ancestor is
being hovered over.

Probably related to issue #64 (which uses IE8.js), in which ancestors
become invisible after hovering.

Original issue reported on code.google.com by goulve...@gmail.com on 7 Aug 2008 at 9:23

Attachments:

• test.html

[GoogleCodeExporter]

The problem is the nesting of the :hover selectors:

{{{
li:hover li:hover li
}}}

I'm not sure that there is an easy way to fix this.

Original comment by dean.edw...@gmail.com on 11 Feb 2010 at 3:42

• Changed title: :hover not applied to nested elements (li:hover li:hover li)
• Changed state: Accepted

[GoogleCodeExporter]

ie_admin habari plugin needs this fixed

Original comment by fun...@gmail.com on 25 Oct 2010 at 2:50

[GoogleCodeExporter]

I too, am having this issue with the following selector:

.dropdown-nav li:hover ul {
}

Sadly, disabling this script caused the :hover to work at the sacrifice of 
opacity and much more.

Original comment by odsl...@gmail.com on 19 Mar 2013 at 4:20