Just to show what is possible with the drop-down series of demonstrations I will be using this page to show some of my attempts at producing web ready menus using this technique.

These menus should work in IE5.5, IE6, IE7, Firefox, Opera, Netscape 8 etc. though not Mac IE5.x.

I will be adding to this page over the coming weeks/months whenever I get the time to experiment.

CASCADING STYLE SHEET

With these menus I have had a rethink on the CSS. Previously I had used one CSS files for IE6 and earlier and another CSS file for IE7 and all other browsers.

But looking at the CSS again I have realised that they are mutually exclusive and can quite happily be combined into just one style sheet. If you look at the head of this document you will see the style sheet embeded

THE (X)HTML

The (x)html code for these menus can be seen in the source code in the 'info' div.

You will see that conditional comments have been used to hold the IE5.5 and IE6 specific version of the menu which used nested tables with nested links. The other browsers will not see the nested links and instead will use the normal nested unordered lists.

Please note that you will also need a standards compliant !doctype for this menu to work correctly.

PROBLEMS WITH FLASH

If you are having problems with your menu dropping down over a flash object then an answer can be found here FAQ: Navigation (flyout) menus are covered up by other things on the page