Выпадающее меню верстается при помощи сложенных списков.
<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>
при этом для первого пункта списка class="dropdown" заданы свои свойства через
#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;
}
в результате первый пункт вложенного списка
#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;
}
наследует эти свойства :first-child. можно ли как-то их отменить для вложенного списка, или для него придется заново переопределять :first-child ? можно, еще, конечно, задать свойства первого пункта не через :first-child, а через класс, но этого бы делать не хотелось.