Thanks for your help.
I don't have it on a live site, so I can't post a link, but I can post the source of the page and my css classes. I modified the DNN menu provider to assign my own css classes and that's how the classes with the background images get assigned.
Here's how I have the DNN Nav:
<dnn:NAV runat="server" ID="dnnNAV" ProviderName="UCUMenuNavigationProvider" IndicateChildren="false"
ControlOrientation="Horizontal"
CSSContainerSub="main_dnnmenu_submenu" CSSNodeHoverSub="main_dnnmenu_itemhover"
CSSNodeSelectedSub="main_dnnmenu_itemselected" CSSContainerRoot="main_dnnmenu_container"
CSSControl="main_dnnmenu_bar" CSSNode="main_dnnmenu_bar" CSSBreak="main_dnnmenu_break" />
</div>
Notice I removed the following:
CSSNodeRoot="main_dnnmenu_rootitem" CSSNodeHoverRoot="main_dnnmenu_rootitem_hover"
CSSNodeSelectedRoot="main_dnnmenu_rootitem_selected" CSSBreadCrumbRoot="main_dnnmenu_rootitem_selected"
I did that because i didn't want those classes overriding mine.
In my provider I add the proper css classes at the node level.
Here's the source of a page where I have the Home tab selected:
Notice the css class assigned to the Home menu item: homeSelected
<input name="__dnnVariable" type="hidden" id="__dnnVariable" value="dnn_dnnNAV_ctldnnNAV_xml<root id=dnn_dnnNAV_ctldnnNAV><n bcrumb=1
selected=1 id=36 key=36 txt= ca=3 url=http://localhost/dnn490/Home/tabid/36/Default.aspx cssHover=homeHover cssIcon= cssSel=homeSelected>
<n id=56 key=56 txt=TestPage2 ca=3 url=http://localhost/dnn490/TestPage2/tabid/56/Default.aspx cssIcon= /></root>SearchIconWebUrlurl(/DNN490/images/Search/google-icon.gif)SearchIconSiteUrlurl(/DNN490/images/Search/dotnetnuke-icon.gif)SearchIconSelectedS" />
Here's my css classes:
.homeHover
{
background-image: url(nav_Home_on.gif);
height: 32px;
width: 100px;
}
.homeSelected
{
background-image: url(nav_Home_active.gif);
height: 32px;
width: 100px;
}
.TestPage1Normal
{
background-image: url(nav_Networks.gif);
height: 32px;
width: 200px;
background-attachment: fixed;
background-repeat: no-repeat;
}
Finally, here's the folder structure (it's the default dnn structure under default folder)
DNN490\Website\Portals\_default\Skins\MinimalExtropy/index.asx -- that's the skin
DNN490\Website\Portals\_default\Skins\MinimalExtropy/css/menu.css -- classes are in this file, images are in this folder.