dimatall, спасибо!
Почти во всём разобрлся сам, при этом порядочно потрепав шаблон так, что его родная мама сейчас не узнает.
Есть небольшая пролемка с меню (горизонтальное выпадающее меню).
Проблема заклчается в том, что выпадающая часть падает под основное меню "облаком" и никак не хочет вытягиваться по вертикали.
Понимаю, что где-то прошляпил параметр
float: none;
Но вот только где???
Код html:
<!--top menu -->
<nav1>
<ul>
<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>
<li><a href='#'>Страница</a></li>
<li><a href='#'>Страница</a></li>
</ul>
</li>
<li><a href='#'>Страница</a></li>
<li><a href='#'>Страница</a></li>
<li><a href='#'>Страница</a></li>
</ul>
</nav1>
<!-- / top menu -->
Код CSS:
section { display: block;
}
menu {
width: 480px; background: none;
}
.nav1 ul {
list-style: none; width: 480px;
position: absolute; margin-top: 55px; ;
}
/* Main menu positioning */
nav1 ul li { display: inline;
}
nav1 {
float: left;
padding: 0;
padding-top: 30px;
padding-left: 5px;
}
nav1 ul li a {
display: block;
float: left;
border-top: 1px solid #96d1f8;
background: #3e779d;
background: -webkit-gradient(linear, left top, left bottom, from(#65a9d7), to(#3e779d));
background: -moz-linear-gradient(top, #65a9d7, #3e779d);
height: 22px;
padding: 0 10px;
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
border-radius: 8px;
-webkit-box-shadow: rgba(0,0,0,1) 0 1px 3px;
-moz-box-shadow: rgba(0,0,0,1) 0 1px 0;
text-shadow: rgba(0,0,0,.4) 0 1px 0;
-webkit-text-stroke: 1px transparent;
font: bold 16px "Arial", sans-serif;
color: rgba(255,255,255,.85);
text-decoration: none;
margin: 0 5px 0 0;
}
/* Submenu */
nav1 li:hover ul {
display: block; /* При выделении пункта курсором мыши отображается подменю */
}
nav1 li ul {
position: absolute; /* Подменю позиционируются абсолютно */
display: none; /* Скрываем подменю */
list-style:none;
padding:20px;
margin:5px;
float:none;
z-index:1
}
nav1 ul li ul {
float:none; /* это не помогло ((( */
}
/*End Submenu */
nav1 ul li a:hover {
border-top: 1px solid #4789b4;
background: #28597a;
background: -webkit-gradient(linear, left top, left bottom, from(#3d789f), to(#28597a));
background: -moz-linear-gradient(top, #3d789f, #28597a);
color: rgba(255,255,255,.85);
}
nav1 ul li a:active, nav1 ul li a.current {
border-top-color: #245779;
background: #20B2AA;
position: relative;
top: 0px;
}
Может кто подскажет - что тут не так?
Заранее благодарен!
