frufunger
Grünschnabel
Hallo,
ich wollte ein drop down Menü per CSS realisieren und kann im Code einfach nicht finden warum die Unterlisten nicht erscheinen...
dazu dieser CSS Code:
Danke für jede Hilfe.
ich wollte ein drop down Menü per CSS realisieren und kann im Code einfach nicht finden warum die Unterlisten nicht erscheinen...
HTML:
<div class="nav">
<ul><li><a href="">1</a></li>
<ul>
<li><a href="">1.1</a></li>
<li><a href="">1.2</a></li>
<li><a href="">1.3</a></li>
</ul>
</ul>
<ul><li><a href="">2</a></li>
<ul>
<li><a href="">2.1</a></li>
<li><a href="">2.2</a></li>
<li><a href="">2.3</a></li>
<li><a href="">2.4</a></li>
</ul>
</ul>
<ul><li><a href="">3</a></li></ul>
<ul><li><a href="">4</a></li></ul>
<ul><li ><a href="">5</a></li>
<ul>
<li ><a href="">5.1</a></li>
<li ><a href="">5.2</a></li>
<li ><a href="">5.3</a></li>
<li ><a href="">5.4</a></li>
</ul>
</ul>
<ul><li><a href="">6</a></li></ul>
</ul>
</div>
Code:
.nav {
text-align: center;
clear: both;
float: left;
width: 100%;
overflow: hidden;
display: block;
list-style-type: none;
margin-bottom: -40px;
padding: 0 40px;
}
.nav ul {
float: left;
position: relative;
list-style-type: none;
}
.nav a{
text-decoration: none;
display: block;
text-align: center;
}
.nav a:hover{
color:#FF0;
}
.nav li {
position:relative;
margin-right:50px;
margin-top: 10px;
}
.nav ul ul{
display:none;
z-index:2;
}
.nav ul li:hover ul{
display:block;
}
.nav ul li:hover ul li{
display:block;
}
Danke für jede Hilfe.