- top level one
- top level two
- top level three
- sub menu one
- sub menu two
- sub menu three
- sub sub menu one
- sub sub menu two
- top level four
#one ul {display: block;
}
#one ul li ul,
#one ul li:hover ul li ul
{display: none;
}
#one ul li
{display: inline;
padding: 0.5em 1em;
position: relative;
border-right: 1px solid #999;
border-left: 1px solid #eee;
}
#one ul li:hover ul
{display: block;
position: absolute;
top: 2.2em;
left: 0;
width: 10em;
}
#one ul li:hover ul li
{display: block;
}
#one ul li ul li:hover ul
{display: block;
position: absolute;
top: 0;
left: 100%;
}
- top level one
- top level two
- top level three
- sub menu one
- sub menu two
- sub menu three
- sub sub menu one
- sub sub menu two
- top level four
#two ul {display: block;
width: 8em;
}
#two ul li
{display: block;
line-height: 2em;
position:relative;
}
#two ul li ul
{display: none;
}
#two ul li:hover ul
{display: block;
position: absolute;
top: 0;
left: 8em;
}
#two ul li:hover ul li ul
{visibility: hidden;
}
#two ul li:hover ul li:hover ul li
{visibility: visible;
}
- top level one
- top level two
- top level three
- sub menu one
- sub menu two
- sub menu three
- sub sub menu one
- sub sub menu two
- top level four
#three ul,
#three li
{display: inline-block;
width: 12em;
}
#three ul li
{line-height: 2em;
text-indent: 4%;
}
#three ul li ul
{
}
#three ul li ul li
{font-size: 90%;
width: 13.3em;
text-indent: 10%;
line-height: 2.4em;
}
#three ul li ul li:first-child
{border-top: 2px solid #fff;
}
#three ul li ul li ul li
{width: 14.74em;
line-height: 2.7em;
text-indent: 20%;
}