Get a free trial // Grow your CSS skills // Land your dream job

Vertical/Horizontal Drop-down Menu Help…

CSS looks like this:

#sideNav {
width: 115px;
float: left;
position: relative;
#sideNav li {
list-style-type: none;
font: 85% Georgia, “Times New Roman”, Times, serif;
background-color: #9df;
margin: 2px 0;
#sideNav a {
text-decoration: none;
color: #fff;
display: block;
padding: 5px;
#sideNav ul {
position: absolute;
left: 115px;
top: 0;
display: none;
#sideNav a:hover {
background-color: #7cf;
#sideNav li:hover ul {
display: block;
# November 22, 2009 at 6:36 pm

each submenu will need a sparate class. give the trandmark submenu a seperate class such as .sideNav_sub and use the similar properties from siteNav

# November 22, 2009 at 10:48 pm

Hello. Thanks for the reply. I couldn’t get the menu to work, even with a separate class on the ul.

What I did find that works, is that the ul has to be inside the list item that triggers it. So, the above HTML code was changed to:

See how </li> tag now appears after the ul that is to be the sub menu?

I’ll leave it on my test site for a couple of days in case anyone wants to see it.

Thank you, though!

Viewing 3 posts - 1 through 3 (of 3 total)

You must be logged in to reply to this topic.

There's a whole bunch of content on CSS-Tricks.

Search for Stuff   •   Browse the Archives

Get the Newsletter ... or get the RSS feed