What I ended up doing was copying the code below and modifying it to fit my needs and that seems to be working so far so if you are looking for a Horizontal Menu with a verticle drop down that is dynamic this code was found on the House Of Nuke website from their menu. I copied it into my skin.css file and it worked fine.
/*********************************************************************
Standard structural CSS that typically should not need to be changed
*********************************************************************/
#HouseMenuNav, #HouseMenuNav ul { /* all submenu lists */
padding: 0;
margin: 0;
margin-top: -5px;
border: 0;
list-style: none;
white-space: nowrap;
z-index: 99999;
position: relative;
}
#HouseMenuNav li { /* all list items */
position: relative;
display: inline;
float: left;
margin: 0;
border: 0;
padding: 0;
}
#HouseMenuNav li li { /* all items under the top level */
z-index: 11113;
}
#HouseMenuNav a { /* all links within the menu wrapper */
display: block;
margin: 0;
border: 0;
padding: 0;
}
#HouseMenuNav li li a { /* all item links under the top level */
margin: 0;
border: 0;
padding: 0;
}
#HouseMenuNav li a:hover {
margin: 0;
border: 0;
padding: 0;
}
#HouseMenuNav li li a:hover {
margin: 0;
border: 0;
padding: 0;
}
#HouseMenuNav li ul {
position: absolute;
margin: 0;
border: 0;
padding: 0;
z-index: 11112;
}
#HouseMenuNav li ul ul { /* third-and-above-level lists */
margin: 0;
border: 0;
padding: 0;
}
#HouseMenuNav li:hover ul ul,
#HouseMenuNav li:hover ul ul ul,
#HouseMenuNav li.sfhover ul ul,
#HouseMenuNav li.sfhover ul ul ul {
left: -9999px;
}
#HouseMenuNav li:hover ul,
#HouseMenuNav li li:hover ul,
#HouseMenuNav li li li:hover ul,
#HouseMenuNav li.sfhover ul,
#HouseMenuNav li li.sfhover ul,
#HouseMenuNav li li li.sfhover ul { /* lists nested under hovered list items */
left: auto;
z-index: 99999;
}
#HouseMenuNav iframe {
position: absolute;
left: 0;
top: 0;
z-index: 0;
filter: progid
XImageTransform.Microsoft.Alpha(style=0,opacity=0);
display: block;
}
.ArrowPointer
{
cursor: default;
}
/*******************************************************
Presentation CSS that typically needs to be customized
*******************************************************/
#HouseMenuNav, #HouseMenuNav ul { /* all submenu lists */
border: solid 1px #036;
width: 100%;
height: 22px;
_height: 20px;
line-height: 12px;
background-color: #369;
}
#HouseMenuNav li { /* all list items */
width: 144px;
height: 22px;
/* hack for MacIE5 to ignore, while other browsers use \*/
width: auto;
_width: 1px;
height: 22px;
_height: 20px;
/* end hack */
}
#HouseMenuNav li li { /* all items under the top level */
width: 148px;
height: auto;
/* hack for MacIE5 to ignore, while other browsers use \*/
width: 134px;
_width: 144px;
/* end hack */
}
#HouseMenuNav a { /* all links within the menu wrapper */
font-family: Verdana, Arial, Helvetica, Sans-Serif;
font-size: 9px;
font-weight: bold;
text-decoration: none;
text-transform: uppercase;
letter-spacing: 1px;
color: #fff;
background-color: transparent;
padding: 5px;
width: auto;
height: auto;
/* hack for MacIE5 to ignore, while other browsers use \*/
_width: 100%;
height: 12px;
_height: 20px;
/* end hack */
}
#HouseMenuNav li li a { /* all item links under the top level */
padding: 5px;
width: 148px;
height: 20px;
/* hack for MacIE5 to ignore, while other browsers use \*/
width: 134px;
_width: 144px;
height: 12px;
_height: 20px;
/* end hack */
}
#HouseMenuNav li a:hover {
padding: 5px;
color: #036;
background-color: #9cf;
height: auto;
/* hack for MacIE5 to ignore, while other browsers use \*/
height: 12px;
_height: 20px;
/* end hack */
}
#HouseMenuNav li li a:hover {
color: #036;
background-color: #9cf;
padding: 5px;
height: auto;
/* hack for MacIE5 to ignore, while other browsers use \*/
height: 12px;
_height: 20px;
/* end hack */
}
#HouseMenuNav li ul { /* second-level lists */
width: 144px; /* width of submenu, must be set so third-level list can get shifted over properly */
left: -9999px; /* using left instead of display to hide menus because display: none isn't read by screen readers */
border: solid 1px #036;
margin: -2px 0 0 0;
/* hack for MacIE5 to ignore, while other browsers use \*/
margin: 0;
/* end hack */
line-height: 12px;
background-color: #69c;
height: auto;
}
#HouseMenuNav li ul ul { /* third-and-above-level lists */
margin: -22px 0 0 144px;
border: solid 1px #036;
line-height: 12px;
background-color: #69c;
}
/* Applied to the parent item, if displayed, in either vertical or horizontal
orientation. Must follow other styles. */
#HouseMenuNav #houseMenuParentItem a
{ /* all links under the parent item (li) */
background-color: transparent;
text-decoration: none;
}
#HouseMenuNav a#houseMenuParentLink
{ /* parent link itself */
background-color: transparent;
text-decoration: none;
}
#HouseMenuNav a#houseMenuCurrentLink
{ /* current link itself */
padding: 5px;
color: #fff;
background-color: #036;
text-decoration: none;
}