Hello CSS Discuss, I have a site all coded up and the only besides cross browser checking left to do is integrate a drop down behavior to one of the menu items: About. I found a couple of articles and I can't the sub menu to work and drop when one hovers over "About". I have tried the methods in the following two articles:
http://www.htmldog.com/articles/suckerfish/dropdowns/ - the code semi works for this one with the exception that once the sub menu drops down once and is hovered over again, it won't stay open if you try to hover over it again the second time around. So I then decided to give this one a try: http://matthewjamestaylor.com/blog/centered-dropdown-menus -even though my menu isn't center aligned thought I could still incorporate the part for the drop down behavior but I can't get that one to work either. Please take a look here for the coded page and try hovering over About - nothing happens: http://e7flux.com/dfd/index.html Here is the snippet of code related to the navigation: #main-nav { overflow: hidden; margin-top: 106px; padding: 0 98px; } #main-nav li { float: left; list-style-type: none; font-family: Arial, Helvetica, sans-serif; /* Whitney Medium */ font-size: 12px; /* 14pt in Whitney Medium */ text-transform: uppercase; color: #FFF; } #main-nav li.home, #main-nav li.about { margin-right: 72px; } #main-nav li.about a { display: block; } #main-nav li.get-involved { margin-right: 326px; } #main-nav li.blog, #main-nav li.donate { margin-right: 72px; } #main-nav a { color: #FFF; font-style: normal; } #main-nav a:hover { color: #023f3b; background: none; } #main-nav li ul#sub-nav { display: none; position: absolute; right: auto; background: url(../images/subnav-bg.png) no-repeat; margin-top: 3px; width: 117px; height: 136px; padding: 11px 15px 0; } #main-nav li ul#sub-nav li { margin: 0 0 9px; left: auto; } #main-nav li ul#sub-nav, #main-nav li ul#sub-nav a { font-family: Georgia, "Times New Roman", Times, serif; font-size: 12px; font-style: italic; text-transform: none; color: #0c4440; } #main-nav ul#sub-nav a:hover { background: url(../images/link-hover-bg.png) bottom repeat-x; } If anyone can help I'd greatly appreciate it - this is due today and this is the one issue that is holding me up!!! I am working off of FF3.6 TIA, Elli Vizcaino Web Designer & Developer http://www.E7Flux.com The Best Compliment We Can Receive Is A Referral! ______________________________________________________________________ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
