Witam mam problem z listą numerowaną gdzy ją rozwijam (menu troche podobe jak w 3 odcinku z CSS)
to zamiast lista zasłonic mi tekst to zsuwa go w dół. szukam i nie widze problemu
Tutaj wycinek z HTML
<div class="nav">
<ol>
<li><a href="serwis.php">Strona główna</a></li>
<li><a href="#">Kalendarz</a>
<ul>
<li><a href="#">Zwykły</a></li>
<li><a href="#">Plan tygodniowy</a></li>
<li><a href="#">Dodaj</a></li>
</ul>
</li>
<li><a href="#">Wydarzenia</a>
<ul>
<li><a href="#">Swięta</a></li>
<li><a href="#">Dodaj</a></li>
</ul>
</li>
<li><a href="#">Profil</a>
<ul>
<li><a href="#">Profil</a></li>
<li><a href="#">Ustawienia</a></li>
<li><a href="wyloguj.php">Wyloguj</a></li>
</ul>
</li>
</ol>
</div>
A tutaj CSS
#body .nav
{
min-height:40px;
margin:10px 0 10px 0;
padding:0;
background-color:#ededed;
}
.sticky
{
width: 1030px;
position: fixed;
top:0;
margin-left:auto;
margin-right:auto;
}
#body .nav ol
{
list-style:none;
margin:0;
padding:0;
}
#body .nav ol>li
{
float:left;
width: 100px;
min-height:20px;
padding:5px;
margin:5px;
text-align:center;
}
#body .nav ol>li:last-child
{
float:right;
}
#body .nav ol>li a
{
color:#000;
text-decoration:none;
}
#body .nav ol>li>ul
{
list-style-type: none;
padding:0;
margin:10px 0 5px 0;
display: none;
text-align:center;
}
#body .nav ol>li:hover>ul
{
display:block;
}
#body .nav ol>li>ul>li
{
padding:0;
margin:0;
line-height:25px;
border-bottom: 2px dashed #ddd;
z-index:100;
}
#body .nav ol>li>ul>li:first-child
{
border-top: 2px dashed #ddd;
}