Reply To: Nested nav

[Tom Houy]

Here is a basic horizontal drop down menu in CSS:

.menustyle ul {
margin: 0px;
padding: 0px;
list-style-type: none;
}
.menustyle ul li {
float: left;
position: relative;
}
.menustyle ul li a {
display: block;
white-space: nowrap;
padding-top: 10px;
padding-right: 25px;
padding-bottom: 10px;
padding-left: 25px;
text-decoration: none;
background-color: #CCC;
}
.menustyle ul li ul {
position: absolute;
visibility: hidden;
}
.menustyle ul li:hover > ul {
visibility: visible;
}
.menustyle ul li ul li {
float: none;
}
.menustyle ul li ul li ul {
left: 100%;
top: 0px;
}

You could obviously spiff it up with gradients, borders, rounded corners, transitions, etc…