Re: Superfish

[Mottie]

Hi lucaswynne!

The `A` doesn’t contain the submenu, only the parent `LI`. So this makes it difficult, if not impossible, to style a submenu’s parent LI’s content. Since Superfish uses jQuery and applys a `sfHover` class to the parent LI, just use that. Users that have javascript disabled won’t see the hover color stay white, but oh well.

Anyway, add this selector `.sub-menu li.sfHover > a` to the hovered portion.

I ended up removing all of the `!important` flags because they aren’t needed when you reduce the specificity of the previous selectors. Here is the modified skin section that I ended up with:

/*** DEMO SKIN ***/
.sf-menu { clear:both }

.sf-menu a {
color:#FFF;
font-size:14px;
font-weight:bold;
padding:10px 15px;
}
.sf-menu a, .sf-menu a:visited { }

.sf-menu .current-post-ancestor a, .sf-menu .current-menu parent a, .sf-menu .current-page-ancestor a, .sf-menu .current-category-ancestor a, .sf-menu .active_category a, .sf-menu .current-menu-item a {
background:#34373D;
}

.sf-menu li {
display:inline;
float:left;
}
.sf-menu li li { color:#FFF; }

.sf-menu a:focus, .sf-menu a:hover, .sf-menu a:active, .sf-menu li:hover a {
background:#3C4751;
}

ul .sub-menu { z-index:1000; }

.sub-menu a {
background:#34373D;
color:#868E98;
}
ul li .sub-menu a:hover, ul li .sub-menu .current-menu-item a, ul li .sub-menu .current-menu-item a:hover, .sub-menu li.sfHover > a {
color:#FFF;
background:#34373D;
}