與CSS不工作的下拉菜單

Question

我正面臨着這個下拉菜單的事情的一些問題。我讀了你的文章，它幫助了我。在開始時，下拉式工作，但當我添加了更多的樣式，然後停止工作。其他div和導航欄工作正常，但下拉菜單不起作用。你能幫我指出這裏應該糾正什麼嗎？

The parent div is nav-bar-left and the style is 
.nav-bar-left { 
float; left; 
overflow: hidden; 
width: 980px; 
height: 26px; 
background-color: Lavender; 
border: 1px solid MidnightBlue; 
border-radius: 3px; 
-moz-border-radius: 3px; 
-webkit-border-radius: 3px; 
} 
The navigation div is #horizontalmenu which resides within the above parent div and the style is 
#horizontalmenu { 
width: 733px; 
margin: 0; 
position: relative; 
float: left; 
padding: 0; 
} 
Rest of the styling for navigation bar is 
#navbar { 
list-style-type: none; 
margin: 0; 
width: 100%; 
padding: 0; 
position: relative; 
display: inline-table; 
height: 26px; 
z-index: 5; 
} 
#navbar li { 
float: left; 
position: relative; 
} 
#navbar a:link, #navbar a:visited { 
display: block; 
color: #333; 
background-color: lavender; 
text-align: center; 
padding: 6px 10px; 
border-style: solid; 
border-color: MidnightBlue; 
border-width: 0 1px 0 0; 
text-decoration: none; 
font-size: 14px; 
line-height: 14px; 
} 
#navbar a:hover, #navbar a:active { 
color: #fff; 
background-color: #6b0c36; 
text-decoration: underline; 
} 
#navbar ul { 
left:-9999px; 
list-style-type: none; 
margin: 0; 
padding: 0; 
position: absolute; 
} 
#navbar ul li { 
float:none; 
border-style: solid; 
border-color: Lavender; 
border-width: 0 1px 1px 1px; 
} 
#navbar ul a { 
white-space: nowrap; 
} 
#navbar li:hover ul { 
left: 0; 
} 
#navbar:hover a { 
text-decoration: none; 
} 
#navbar li:hover ul a { 
text-decoration: none; 
background-color: Lavender; 
color: #333; 
} 
#navbar li:hover ul li a:hover { 
background-color: Lavender; 
color: #333; 
} 

那麼，爲什麼它不工作，可以做什麼？

Answer 1

，我發現這個菜單CSS我最好的收藏之一下拉菜單：

Create a Multilevel Dropdown menu with CSS and improve it via jQuery

，你可以找到這些代碼here in my pastebin的備份。