The drop-down menu is made up using the folded lists.
<div id="sidebar"> <ul class="dropdown"> <li><a href="">Продукция</a></li> <li><a href="">Мебель из стекла</a> <ul> <li><a href="">Столы обеденные</a></li> <li><a href="">Столы журнальные</a></li> <li><a href="">Столы по индивидуальным проектам</a></li> <li><a href="">ТВ тумбы</a></li> <li><a href="">ТВ стойки</a></li> <li><a href="">Стеклянные компьютерные и офисные столы</a></li> <li><a href="">Цельно-стеклянная мебель</a></li> </ul> </li> <li><a href="">Стекло триплекс</a></li> </ul> </div> at the same time, for the first item of the list class = "dropdown", its properties are set via
#sidebar ul.dropdown li:first-child { background: url('../images/menu_header_item.png') no-repeat; width: 272px; height: 44px; color: #ffffff; text-transform: uppercase; font-family: 'Book Antiqua', serif; font-weight: bold; font-size: 18px; text-align: center; padding-top: 12px; padding-left: 0; list-style-image: none; margin-bottom: -10px; } #sidebar ul.dropdown li:first-child a { color: #ffffff; } as a result, the first item in the nested list
#sidebar ul.dropdown li > ul { visibility: hidden; position: absolute; top: 0; left: 272px; z-index: 999; width: 100%; background: #ffffff; border: 1px solid #50a1b5; width: 232px; padding: 0; } #sidebar ul.dropdown li:hover > ul { visibility: visible; } inherits these properties: first-child. can I somehow cancel them for the nested list, or will it have to be redefined for it: first-child? it is possible, of course, to set the properties of the first item not through: first-child, but through the class, but this would not be desirable.
