Working with Pure CSS Drop Down Menus

Pure CSS drop down menus are designed to function without javascript, flash or any other scripting tool. They consist of a standard unordered bullet list and use standard stylesheets for formatting. Some CSS menus will also use Javascript for embellishments, but if a browser doesn't support javascript or if it is turned off, the menus "degrade" ellegantly and still function properly. In fact, they will degrade down to just a bullet list for browsers for the blind. Take the following mock menu as an example:

Without CSS styling, they are simply a bullet list starting with all of the menu 1 items first:

• Menu Item 1
  • Sub Item 1-1
    • Sub Sub Item 1-1-1
    • Sub Sub Item 1-1-2
  • Sub Item 1-2
  • Sub Item 1-3
• Menu Item 2
  • Sub Item 2-1
  • Sub Item 2-2
    • Sub Sub Item 2-2-1

Notice how the indented bullets become the sub menu items.

Using My Market Tookit Simple Menu KMod

The "Sequence:" changes the order of the bullet list items.The "List # (Indent:)" changes the level at which an item is indented in the menu.

For example:

• Menu Item 1 (Sequence: 01, List # Indent: 1)
  • Sub Item 1-1 (Sequence: 02, List # Indent: 2)
    • Sub Sub Item 1-1-1 (Sequence: 03, List # Indent: 3)
    • Sub Sub Item 1-1-2 (Sequence: 04, List # Indent: 3)
  • Sub Item 1-2 (Sequence: 05, List # Indent: 2)
  • Sub Item 1-3 (Sequence: 06, List # Indent: 2)
• Menu Item 2 (Sequence: 07, List # Indent: 1)
  • Sub Item 2-1 (Sequence: 08, List # Indent: 2)
  • Sub Item 2-2 (Sequence: 09, List # Indent: 2)
    • Sub Sub Item 2-2-1 (Sequence: 10, List # Indent: 3)

Once the bullet list is created, the CSS styles will format the menu correctly on the site.