Ok so you replaced the navigation text etc with images, via their id's but when you select an item during the page refresh it changes the id to the navCurrentLink. Which reverts out your styling. You could style the navCurrentLink, but it will apply that styling to whatever active menu item you are on. If your just putting an image as a background or such not a biggy. IE if your just saying background-image: image and you want that image to be the same regardless of the current page, then your ok. But if your wanting a specific image per menu item / root item then that won't work. There is one trick that I use for a root menu where I have custom images. You make a skin for each root item, and create a "new" instance of the housemenu per skin. So Homepage skin Housemenu set the CssElementId = Housemenu. Then style it accordingly. Create a new ascx / html file and this time its HouseMenu:2 and set it to CssElementId = HouseMenu2 then style HouseMenu2 accordingly for that page. Then set the root page and all subpages to use the appropriate skin. IE the Homepage and any pages below it use Homepage. Now the only downside to this method is when you navigate to a subchild your root item no longer uses the navCurrentLink id. This means your subpages menu selection will use the navCurrentLink styling. This is not a "bad" thing depending on how your menu / navigation is setup on your site, but it can be quite annoying. Naturally you can resolve this issue by creating a custom skin for each page which controls the styling. Let me know if that was all greek or if you makes any sense. I have an example you could follow if you want. Its html + xml + CSS but the concept remains the same for ascx files.

Its a bit hard for me to build / give an exact work around without seeing the navigation your trying to accomplish, but I think I have the general id.

keeperofstars,

I created my own work-around by using a little bit of javascript magic.  At the bottom of my ascx template file I use some javascript that locates the menu in the DOM and replaces the IDs with the proper page names.  So for example:

<li id="navItem55"><a id="navLink55" href="http://mysite.com/About/tabid/55/Default.aspx" title="About" tabindex="1">About</a>
becomes:
<li id="navItem55"><a id="About" href="http://mysite.com/About/tabid/55/Default.aspx" title="About" tabindex="1">About</a>

This way each parent link has it's own unique identifyer which also relates to the section or page.  Now I've only got one more issue to solve and that is the css drop-downs in firefox look great, but in IE they are either not appearing at all or appearing all the way down the page!  I've noticed there is some text in there saying "false" and the alignment / positioning is all messed up.  Could it be that the skinobject.js has some code that is mucking up my drop-downs in IE???

Once again, any advice would be greatly appreciated!!

SuperDMon