I am creating a menu system using the UL / LI structure. I am trying to use selector clips for hover / show-sub-menus.
I use this;
#MainMenu li.Sel ul li.HasSub a:hover+ul {
display: block;
}
The UL structure will be something like this:
<ul id='MainMenu'>
<li class='Sel'>
<a href='#'>Click Me</a>
<ul>
<li class='HasSub'>
<a href='#'>Hover Over Me</a>
<ul>
<li>Link</li>
<li>Link</li>
</ul>
</li>
</ul>
</li>
</ul>
Presumably, when you hover over "Hover Over Me", sibling ul should be displayed. It works fine in Firefox, but not in IE8 at all. I'm sure I saw the "+" selector used in IE8 before, where am I mistaken?
source
share