Dropdown menu

This is a more or less standard style of dropdown menu where the mouse hovering over the horizontal menu items causes a vertical submenu to appear. Some people, like me, find it slightly irritating to have anything blocked by something else. It is not super important but if the menu items are arranged carefully and the submenus are not too verbose, it can be avoided by having the submenu appear horizontally, in the space carefully provided for by an appropriate top margin for the element next down, namely the content.

One of the factors that causes the submenu items to appear vertically is that they simply have no room to do otherwise, their width is constrained and so they wrap. Their verticality is a side effect.

Using this knowledge, one can easily manipulate things to be different to make the sub items appear horizontally. This might suit some designs. The advantage being that there is no irritating blocking off of content by other content. See an example of a popout horizontal menu

The basic strategy of this comes from an outline at htmldog.com/articles/suckerfish/dropdowns/. I have styled and modified a few small things, that's all.