Не могу сообразить, где исправить стиль для активного и неактивного подпункта меню. Вот как выглядит меню сейчас: А вот как выглядит активный подпункт (в данном случае "две двери"): Как видите, пиктограмма справа отображается почти правильно (хотя хотелось бы чтобы на родительском пункте она была всё-таки неактивной). Такое отображаение естественно никуда не годится, надо чтобы все пункты были белые (неактивные) а активный подпункт - чёрный. Вот мой код CSS, связанный с данным блоком: Код (CODE): #left ul { list-style:none; margin-right:10px; } #left ul.menu li.active a { color:#333333; border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; border-top-style: none; border-right-style: none; border-bottom-style: none; border-left-style: none; font-weight: 600; text-decoration: underline; } #left ul a:link, #left ul a:visited { padding: 5px; margin: 5px; color: #FFCCCC; text-decoration: none; font-family: "Segoe UI", "Arial Narrow", sans-serif; font-size: 18px; text-align: right; vertical-align: middle; display: block; } #left ul a:hover { color: #FFFFFF; text-decoration:underline; } #left li { background-image: url(../images/list_white.png); background-repeat: no-repeat; background-position: right 15px; line-height: normal; padding-top: 0px; padding-right: 17px; padding-bottom: 0px; } #left li a:link, #left li a:hover { color: #FFCCCC; !important text-decoration: none; } #left li.active { background-image: url(../images/list_black.png); background-repeat: no-repeat; background-position: right 15px; line-height: normal; padding-top: 0px; padding-right: 17px; padding-bottom: 0px; } Направьте меня пожалуйста в нужное русло... Спасибо. P.S. Если у кого то есть в закладках ссылочки на хороший понятный материал как сделать выпадающее меню (или разворачивающееся... не знаю как правильно поэтому и гуглить уже замучался), чтобы при нажатии например на "дверные композиции" три пункта откатились и обратно свернулись при нажатии на другой пункт меню.