да, действительно нашел без проблем
Тут я столкнулся с другой траблой...реализовав меню 3го уровня в выпадающем меню я заметил что стили для 2го и 3го уровня присваиваются одинаковые...пол дня продолбался чтобы разделить их...и в силу недостатка знаний у меня это не очень хорошо вышло...Собсно я хотел присвоить отдельный стиль для меню 2го уровня (другой шрифт и цвет букв), а подменю последнего уровня оставить как есть...как не крутил - все стили присваиваются для обоих категорий одновременно.
И ещё одна проблема:
При наведении на главное горизонтальное меню - выпадают меню 2й и 3й категории в развернутом виде - всё как положено...но если я навожу мышкой на какую-нибудь категорию последнего уровня и после этого перевожу курсор на другое меню - оно сворачивается...Пробовал задавать position: static; fixed и т.д - не помогло...
будьте добры - дайте совет нубу :)
css прилагается
#menu {
height: 47px;
margin-bottom: 15px;
padding: 0px 5px;
background: #19830e;
background: -moz-linear-gradient(#19830e, #58ba3d);
background: -webkit-gradient(linear,left bottom,left top,color-stop(0, #0C3),color-stop(1, #060));
background: -webkit-linear-gradient(#19830e, #58ba3d);
background: -o-linear-gradient(#19830e, #58ba3d);
background: -ms-linear-gradient(#19830e, #58ba3d);
background: linear-gradient(#1f9f2e, #19830e);
-moz-border-radius: 5px;
border-radius: 5px;
-moz-box-shadow: 0 2px 2px #19830e;
-webkit-box-shadow: 0 2px 2px #19830e;
box-shadow: 0 2px 2px #19830e;
}
#menu ul {
list-style: none;
margin: 0;
padding: 0;
}
#menu > ul > li {
position: relative;
float: left;
z-index: 20;
height: 60px;
}
#menu > ul > li > a.active {
color: #fafafa;
display: run-in;
position: relative;
}
#menu > ul > li > a
/*#menu > ul > li > div > ul > li > a*/
{
color: #fff;
display: block;
font-size: 13px;
font-weight: bold;
line-height: 24px;
padding: 12px 15px 11px;
position: relative;
text-decoration: none;
text-shadow: 0 1px 0 #000000;
text-transform: capitalize;
z-index: 6;
border-left: 1px solid #444444;
border-right: 1px solid #0C3;
}
#menu > ul > li:first-of-type a {
border-left:none;
}
#menu > ul > li:last-of-type a {
border-right:none;
}
#menu > ul > li > a:hover {
color: #fff;
background: #0C3;
}
#menu ul > li:first-of-type a:hover {
background: none;
}
#menu ul> li:last-of-type a:hover {
background: none;
}
#menu > ul > li > div {
margin-top: 2px;
padding: 2px;
display: none;
position: absolute;
z-index: 99999;
background: #58ba3d;
background: -moz-linear-gradient(#19830e, #58ba3d);
background: -webkit-gradient(linear,left bottom,left top,color-stop(0, #060),color-stop(1, #0C3));
background: -webkit-linear-gradient(#19830e, #58ba3d);
background: -o-linear-gradient(#19830e, #58ba3d);
background: -ms-linear-gradient(#19830e, #58ba3d);
background: linear-gradient(#1f9f2e, #19830e);
-moz-border-radius: 3px;
border-radius:3px;
-moz-box-shadow: 0 2px 3px #19830e;
-webkit-box-shadow: 0 2px 3px #19830e;
box-shadow: 0 2px 3px #19830e;
}
#menu > ul > li > div > ul > li > div
{
display: block;
background: #FFFFFF;
position: static;
z-index: 5;
padding: 0px;
margin-rigt: 0px;
border: 0px solid #000000;
-webkit-border-radius: 0px 0px 5px 5px;
-moz-border-radius: 0px 0px 5px 5px;
-khtml-border-radius: 0px 0px 5px 5px;
border-radius: 0px 0px 5px 5px;
background: url('../image/menu.png');
}
#menu > ul > li:hover > div,
#menu > ul > li:hover > div > ul > li:hover > div
{
display: block;
}
#menu > ul > li > div > ul,
#menu > ul > li > div > ul > li > div > ul
{
display: table-cell;
}
#menu > ul > li ul + ul,
#menu > ul > li ul > li ul + ul
{
padding-left: 10px;
}
#menu > ul > li ul > li > a {
text-decoration: none;
padding: 9px;
color: #999999;
display: block;
white-space: nowrap;
min-width: 120px;
border-radius: 3px;
text-shadow: 0 1px 0 #000000;
text-transform: capitalize;
font-size:12px;
font-family: Tahoma, Geneva, sans-serif;
}
#menu > ul > li ul > li > a:hover {
background: #0C3 !important;
background: -moz-linear-gradient(#090, #0C3) !important;
background: -webkit-gradient(linear, left top, left bottom, from(#090), to(#0C3)) !important;
background: -webkit-linear-gradient(#090, #0C3) !important;
background: -o-linear-gradient(#090, #0C3) !important;
background: -ms-linear-gradient(#090, #0C3) !important;
background: linear-gradient(#090, #0C3) !important;
-moz-box-shadow: 0 10px #0C3;
-webkit-box-shadow: 0 1px #0C3;
box-shadow: 0 1px #0C3;
}
#menu > ul > li > div > ul > li > a,
#menu > ul > li > div > ul > li > div > ul > li > a
{
color: #FFF;
}