I can't seem to get my root and submenus to retain the same mouseover effects. I am tryin to do something that I think should be very simple - make the background color darker on a mouseover or selected state in both the root and the sub menus. In this case, I am trying to apply exactly the same colors to the root and submenus but I'd like to be able to make the submenus different in the future.
This is the definition in my .ascx file
<dnn:SOLPARTMENU runat="server"
id="dnnSOLPARTMENU"
iconwidth=0
userootbreadcrumbarrow="false"
usearrows="false"
rightseparator="<img src="images/menu_div.gif">"
/>
and this is what I've defined in my CSS
.MainMenu_MenuItem, .MainMenu_MenuItem TD
{
background-color: #209519;
color: #FFFFFF;
font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
font-style: normal;
font-weight: bold;
cursor: pointer;
cursor: hand;
padding-left: 4px;
padding-right: 4px;
height: 25px;
}
.MainMenu_MenuItemSel, .MainMenu_MenuItemSel TD
{
background-color: #336600;
color: #FFFFFF;
font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
font-style: normal;
font-weight: bold;
cursor: pointer;
cursor: hand;
padding-left: 4px;
padding-right: 4px;
height: 25px;
border-top-style:solid;
border-top-color:#FFFFFF;
border-top-width: 1px;
border-bottom-style:solid;
border-bottom-color:#FFFFFF;
border-bottom-width: 1px;
}
.MainMenu_MenuArrow, .MainMenu_RootMenuArrow, .MainMenu_MenuIcon {display: none; }
I've tried many variations but can't seem to get everything to work all at once. What I've included works correctly for the root, but not the submenus. Any assistance would be most appreciated.