ThemeShaper Forums

Help In Shaping WordPress Themes

Register or log in:

Username:
Password:

Remember me

ThemeShaper Forums » Thematic

1. 

   elderberry
   Member

   The top level link appears to vanish when you hover over items in the second level dropdown. Hover over the About link is fine, but when you move the cursor down over High Ridge Board the About text changes color to match the background :-( http://horses.alterra-wv.com/

   /*** THEMATIC SKIN ***/
.sf-menu {
border-right:1px solid rgb(102,153,153);
float:left;
}
.sf-menu a {
border-left:1px solid rgb(102,153,153);
border-top:1px solid rgb(102,153,153);
border-bottom:1px solid rgb(102,153,153);
padding:9px 13px;
text-decoration:none;
}
.sf-menu .current_page_item a,
.sf-menu .current_page_ancestor a,
.sf-menu .current_page_parent a {
border-bottom-color:rgb(245,245,223);
background:rgb(245,245,223);
}
.sf-menu a, .sf-menu a:visited { /* visited pseudo selector so IE6 applies text colour*/
color:rgb(102,153,153);
}
.sf-menu li {
background: rgb(153,194,194) url(http://high-ridge.alterra-wv.com/button-off.gif) repeat-x 0px -10px;
}
.sf-menu li li {
background:rgb(153,194,194) url(http://high-ridge.alterra-wv.com/button-off.gif) repeat-x 0px -10px;
}
.sf-menu li li li {
background:rgb(245,245,223);
}
.sf-menu li:hover, .sf-menu li.sfHover,
.sf-menu a:focus, .sf-menu a:hover, .sf-menu a:active {
color : #fff;
background : rgb(102,153,153) url(http://high-ridge.alterra-wv.com/button-on.gif) repeat-x 0px -10px;
outline: 0;
border-bottom-color:#ccc;
}
.sf-menu ul {
border-right:1px solid gb(102,153,153);
border-bottom:1px solid gb(102,153,153);
}
.sf-menu li:hover ul,
.sf-menu li.sfHover ul {
top:32px; /* overriding essential styles */
}
.sf-menu ul ul {
margin-top:0;
}
.sf-menu ul a {
background:#fafafa;
border-bottom:none;
}
.sf-menu ul a:hover {
color: #FFF;
}

   Posted 1 year ago #
2. 

   helgatheviking
   Moderator

   it is "vanishing" b/c it is no longer holding the :hover pseudoclass that changes the color in the first place. so it is reverting to the default "down-state" color.. which i think is the same color as your background.

   you are using .sf-menu li.sfHover - so the LI element is getting the blueish background, but the link isn't getting the same definition.

   try adding .sf-menu li.sfHover a into the style rule for the hovers.

   .sf-menu li:hover, .sf-menu li.sfHover, .sf-menu li.sfHover a,
   .sf-menu a:focus, .sf-menu a:hover, .sf-menu a:active {
        color : #fff;
       background : rgb(102,153,153)  url(http://high-ridge.alterra-wv.com/button-on.gif) repeat-x 0px -10px;
   	outline:		0;
       border-bottom-color:#ccc;
   }

   Posted 1 year ago #
3. 

   elderberry
   Member

   Thanks! Worked perfectly.

   Posted 1 year ago #

RSS feed for this topic

Reply

You must log in to post.