/** suckerfish dropdown menus * improved multi-level accessible seo-friendly technique * from article http://htmldog.com/articles/suckerfish/dropdowns/ * needs suckerfish.js to work in explorer browsers * * custom implementation by frank pfabigan (seoscout), mailto:frank.pfabigan@gmail.com * for seo-friendly wp-theme on http://seo-scout.org */ #sf, #sf ul { /* all lists */ padding: 0; margin: 0; list-style: none; } #sf a, #sf a:hover, #sf a:visited, #sf a:active { display: block; width: auto; text-decoration: none; padding: 4px 12px; background-color: #fff; color: #146eb4; border-right: 2px solid #146eb4; border-bottom: 1px solid #146eb4; font-weight: normal; } #sf a:hover, #sf a:active { color: #ed870b; text-decoration: underline; } #sf li { /* all list items */ float: left; width: 8em; /* width needed or else Opera goes nuts */ width: auto; } #sf li ul { /* second-level lists */ position: absolute; width: 10em; left: -999em; /* using left instead of display to hide menus because display: none isn't read by screen readers */ } #sf li ul ul { /* third-and-above-level lists */ margin: -1em 0 0 10em; } #sf li:hover ul ul, #sf li.sfhover ul ul { left: -999em; } #sf li:hover ul, #sf li li:hover ul, #sf li.sfhover ul, #sf li li.sfhover ul { /* lists nested under hovered list items */ left: auto; }