On April 17, 2007, Roger Keays wrote: > Hi all, I've posted a new article on my site explaining CSS menus: > http://www.sunburnt.com.au/publications/design/css_menus I guess this > is pretty archaic stuff really, but I'd be interested if anybody has > some feedback or can spot some bugs. It's been 4 years since I first > wrote about CSS menus, and I think I've got them pixel-perfect now :) > Roger
Hi Roger I going to be brutally honest. You have used display:none to hide the unhovered submenus. This is not good for accessibility. Some screen readers will not display those parts of the menu with this value. The display:none also prevents the submenu list items to be tab to in any browser, again not good for accessibility. The value display:none should never be used in list menus or for most coding in general. The are much simpler methods like position:absolute -999em. Opera8 adds padding at the bottom of each ul element. IE7 is buggy. When the the containing li is hovered after text sizing down, the descending ul preserves the width of the larger text size width until the ul element is hovered. The bug happens in reversed when text resizing up. Sometimes the list items padding reduces when hovered. There are 30 lines of javascript which does not include the comments. The sons of suckerfish dropdowns have 12 lines and that is all that is needed. The javascript should be in conditional comment targeting for IE6 and earlier or a browser that doesn't need the javascript still has to download it. Most importantly, how does the menu work when there a doctype? You have no doctype, so mordern browsers are rendering the menu in quirks mode. Soon I will be demonstrating a list menu that builds on to the strengths of the sons of suckerfish menus, and like the suckerfish menus is accessible and with no bugs. http://www.htmldog.com/articles/suckerfish/dropdowns/ Kind Regards, Alan ______________________________________________________________________ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
