Hello,
I am trying to create drop down menus (one level, dropping down from horizontal
list items in a top nav bar). My issue is that that, while the drop down menu
appears when hovering over top level list item, when the user moves OFF of that
list item to move into the drop down sublist, the sublist disappears. I must
be missing something in my css that keeps the list visible. My Css is as as
follows. Thank you for any suggestions.
div#navbar ul.toplist
{
padding: 0;
list-style: none;
}
div#navbar li.toplistitem { /* all list items in top nav*/
float: left;
position: relative;
padding: 0;
font-family:Verdana, san-serif;
font-size:.75em;
height:25px;
width:16.53%;
}
div#navbar ul.sublist { /* second-level lists */
display: none;
position: absolute;
list-style: none;
top: 29px;
left: 0;
width: 300px;
background-color:#F9F2D1;
background-color:#FEFAE9;
padding-bottom:20px;
-moz-border-radius: 7px;
-webkit-border-radius: 7px;
border-left: 1px solid #F9EBAE;
border-right: 1px solid #F9EBAE;
border-bottom: 1px solid #F9EBAE;
}
div#navbar li.toplistitem:hover
{
background-color:#FEFAE9;
}
div#navbar li.toplistitem:hover ul { /* lists nested under hovered list items */
display: block;
}
div#navbar ul.sublist li.sublistitem
{
line-height:140%;
padding:15px;
font-size:.9em;
margin-bottom:-20px;
}
div#navbar a.itemtitle
{
font-weight:bold;
font-size:1.2em;
}
Angela French
Internet Specialist
State Board for Community and Technical Colleges
360-704-4316
http://www.checkoutacollege.com
______________________________________________________________________
css-discuss [cs...@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
