Подскажите пожалуйста, как мне сверстать это меню правильно. При нажатии на пункт "Статьи" отображаются все подпункты всех пунктов, а мне нужно чтобы при нажатии на "Статьи" отображались только пункты "Города", "Страны", а при нажатии на страны отображались "Федеративные" и т.д. Вот код меню со стилями: <div id="navigation" class="row navigation"> <div class="moduletable"> <ul class="nav menu"> <li class="item-101 current active"><a href="/">Главная</a></li> <li class="item-120"><a href="/kategorii-k2">Контакты</a></li> <li class="item-139"><a href="/magazin">О нас</a></li> <li class="item-142 divider deeper parent"> <span class="separator">Статьи</span> <ul class="nav-child unstyled small"> <li class="item-140"><a href="/menyushka/podpunkt">Города</a></li> <li class="item-141 deeper parent"><a href="/menyushka/podpunkt-2">Страны</a> <ul class="nav-child unstyled small"> <li class="item-143 deeper parent"><a href="/menyushka/podpunkt-2/podpunkt-3">Федеративные</a> <ul class="nav-child unstyled small"> <li class="item-144"><a href="/menyushka/podpunkt-2/podpunkt-3/podpunkt-4">Россия</a></li> </ul> </li> </ul> </li> </ul> </li> <li class="item-172"><a href="/forum">Форум</a></li> <li class="item-204"><a href="/otzyvy">Отзывы</a></li> </ul> </div></div><style>.menu ul{ display:none; position:absolute; top:30px; left:0px; background:#000; width:200px;}.menu li{position:relative; float:left; padding:10px;}li:hover ul{display:list-item;}li:hover li{float:none;}li:hover li a{float:none;}.menu ul li:hover{background:#1b1b1b;}</style>