Is there a way to rearrange the submenu links so they appear stacked vertically instead of horizontally? Currently, they line up next to each other under the main menu and subsequent links fall below the submenu. I believe it involves adjusting the position properties, but I'm not sure which ones or where to make the changes.
CSS
#nav {
background-color: #8D8084;
}
#nav ul {
margin:0;
list-style-type: none;
padding: 12px;
}
#nav li {
display:inline;
}
#nav a {
}
#nav ul li a {
text-decoration:none;
color:#fff;
padding-right: 60px;
padding-top: 15px;
padding-bottom: 13px;
padding-left: 50px;
margin: -12px;
background:#8D8084;
font-family: Candara,"Trebuchet MS", Helvetica, sans-serif;
font-size: 13px;
font-weight: bold;
text-transform:uppercase;
}
#nav ul li.active a {
background-color:#A4999D;
color:#FFFFFF;
}
#nav a:hover {
background-color:#A4999D;
color:#FFF;
}
#nav ul ul {
display: none;
}
#nav ul li:hover > ul {
display: block;
}