Drop-Down Menus, Horizontal Style

by Nick Rigby

296 Reader Comments

Back to the Article
  1. IIRC horizontal goes this way:
    <—————><—————><—————>

    Vertical, which is what this menu is, goes this way:
    <—————>
    <—————>
    <—————>

    the worst part is, in clicking thru the first few pages of the discusion section to see if this issue had been raised ( why can I not request to see ALL of the discussion in a single page so I can use firefox’s find feature more quickly? ) It seemed as though everyone else had accepted this reversal of the meaning of horizontal and vertical.

    aCk!!

    Copy & paste the code below to embed this comment.
  2. Hi

    Despite all the chat about repetitions, this tutorial has been invaluable to me despite having read other articles about nested lists.  This was the cleanest solution I have found to date.  However, although I have managed to create it on my page so it works fine in IE (bizarrely enough without using the Holly Hack), my sub links don’t work on any other browser and they display oddly.  My test page is at: http://www.azuremarketing.com/cssAzure/index_test.htm and I have so far only added links from one section.

    I’m sorry if something has already been written about this in the discussion previously, but I’ve had a trawl through and can’t find any reference to it.

    I’ve been through my links and it may be that I’ve consused something through my use of an additional div.

    Any advise would be really appreciated.

    Many thanks

    Vicky

    Copy & paste the code below to embed this comment.
  3. I’ve been trying to get this code to show multiple menus as the menu I need is in a php loop and is shown multiple times with some changes done to it, the entries differ.

    Now the problem is that in IE and Opera only the first instance of the menu works and others only show the main ul and don’t “dropdown” but in firefox everything works perfectly.

    Any ideas on how this would be fixed?

    Copy & paste the code below to embed this comment.
  4. I’ve been trying to get this code to show multiple menus as the menu I need is in a php loop and is shown multiple times with some changes done to it, the entries differ.

    Now the problem is that in IE and Opera only the first instance of the menu works and others only show the main ul and don’t “dropdown” but in firefox everything works perfectly.

    Any ideas on how this would be fixed?

    Copy & paste the code below to embed this comment.
  5. Is there a way to develop this in a similar manner, except this time horizontal rather than vertical…

    Im really new to CSS so i wont be able to do it myself :(

    Copy & paste the code below to embed this comment.
  6. “Is there a way to develop this in a similar manner, except this time horizontal rather than vertical…”

    There is a link in the article to the original menu that this one was derived from, which was horizontal:

    http://www.alistapart.com/articles/dropdowns/
    http://www.htmldog.com/articles/suckerfish/example/

    Copy & paste the code below to embed this comment.