Навигационный раскрывающийся список исчезает, когда я пытаюсь навести курсор

Question

В принципе, я сделал действительно хороший навигатор и все, однако выпадающее меню, которое я сделал, не работает, оно отображается при наведении на вкладку «Сообщество», но исчезает, когда я пытаюсь навести на него: (

кто-нибудь знает, как я могу это исправить

Вот мой код:

<div class="navigation"> 
      <ul class="navigation_items"> 
       <li class="active"><a href="index.html">Home</a></li> 
       <li><a href="about.html">What we do</a></li> 
       <li> 
        <a>Community</a> 
        <ul> 
         <li><a>Forums</a></li> 
        </ul> 
       </li> 
       <li><a href="contact.html">Contact</a></li> 
      </ul> 
     </div> 

Проверьте код CSS в jsfiddle

http://jsfiddle.net/8a92u/

Answer 1

Нажмите бит субменю над основной литий поэтому сохраняет меню на парении.

Добавить margin-top:-10px в подменю ul и padding-top: 10px, чтобы вернуть его к тому же самому пользовательскому интерфейсу.

.navigation_items ul { 
    background-color: rgb(28, 28, 28); 
    border-radius: 0px; 
    padding: 0; 
    position: absolute; 
    top: 100%; 
    margin-top: -10px; 
    padding-top: 10px; 
} 

DEMO

Answer 2

Используйте это:

.navigation_items li:hover > ul, 
.navigation_items li > ul:hover { 
    display: block; 
    margin-top: -10px; 

} 

вместо этого:

.navigation_items li:hover > ul { 
    display: block; 
} 

Answer 3

.navigation_items ul { 
    display: none; 
    margin-top: -10px; 
}