Quote from: jwtyler at May 17, 2006, 03:31 PM
The easiest way to debug this is look at the xhtml that drop menu is putting out on your site. You can see the nested <li> and <ul> tags. Then create a here class for the level you are trying to effect i.e. menu ul li li and the display action you want.
And the easiest way to look at the tags that are in the XHTML is to use FireFox with the
Web Developer Extension. Once the extension is installed, choose
"Outline --> Outline Current Element..." and hover over the item you want to style with CSS. on the bottom bar of the browser window, you will see a path from the top level of the html document to the current ID or Class, listing it’s exact CSS path for you. all you have to do is make an entry in your CSS for that particular item.
For example, on my own website,
http://www.scottydelicious.com/ if you were to outline current element and hover over the link in my menu area that says "home", you would see along the bottom
html> body#scottydelicious > div #container > div #sidebar > div #pages > div #pagec > ul.topnav > li.here
so, to style this item, I could use all those tags, or, since I know it is the only drop menu in the #pagec div, I can use
#pagec ul.topnav li.here {
color:#ff9900;
padding:0;
margin:0;
}
So you can see how easy the Web Developer plugin makes styling drop menu, because it tells you exactly what you need to style!
-sD-
I know that scotty’s tutorial over the last couple days has helped me finally get a grasp on making drop menu do what I want. And it has done more than make dropmenu prettier for me. Now I can do things like make a sitemap etc. 
