Nick La from WebDesignerWall shows us how to slice up the menu design (step by step) and put them together with CSS. Most of you probably know how to code a horizontal or vertical CSS list menu. Now let’s take it to the next level — code an advanced list menu utilizing the CSS position property. You can view the working example here.

Note: there is an IE6 bug where the <span> hover effect doesn’t display properly. To fix that, you can use Javascript to specify the <span> to display block on mouseover.

Requirements: -
Demo: http://www.webdesignerwall.com/tutorials/advanced-css-menu/
License: License Free