Botovskiu
Junior Member | Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Помогите сделать третий уровень меню.
css
Код:
.glossymenu, .glossymenu li ul{
list-style-type: none;
margin: 0;
padding: 0;
width: 256px;
font-size:14px;
}
.glossymenu li{
position: relative;
margin:0; padding:5px 0 10px 0; background:url(../images/menu-bg.png) 10px 100% no-repeat; list-style-type:none;
}
.glossymenu li ul{
position: absolute;
width: 256px;
left: 0;
top: 0;
padding-left:10px;
display: none;
filter:alpha(opacity=100);
-moz-opacity:1;
background-color:#F8F8F8;
font-size:12px;
-webkit-box-shadow: 6px 6px 5px rgba(50, 50, 50, 0.21);
-moz-box-shadow: 6px 6px 5px rgba(50, 50, 50, 0.21);
box-shadow: 6px 6px 5px rgba(50, 50, 50, 0.21);
}
.glossymenu li a{
width: auto;
display:block; padding:4px 0 0 5px; min-height:20px; text-transform:uppercase; text-decoration: none; color:#CB0000;
}
.glossymenu li a:hover{
color: #FF6D6E;
}
/* Holly Hack for IE \*/
* html .glossymenu li { float: left; height: 1%; }
* html .glossymenu li a { height: 1%; }
/* End */
|
html
Код:
<ul id="verticalmenu" class="glossymenu">
<li><a href="#">Солнечные коллектора</a>
<ul>
<li><a href="#">Вакуумные </a></li>
<li><a href="#">Плоские </a></li>
<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>
</ul>
</li>
</ul>
</li>
</ul>
|
Добавлено:
Я в html третий добавил, он есть, но он не с права в конце блока второго, а поверх, закрывает разделы все. |
