Firefox rückt verschachtelten <li> nicht ein
tempo74
- css
Hallo Leute!
Ich habe ein Problem mit einer verschachtelten Navigationsstruktur!
In der 2. Ebene werden die <li> im Firefox nicht eingerückt. Diese bleiben am Rand stehen, wo sich auch die erste Ebene befindet.
Mein CSS lautet:
ul {
padding:3px 0px 3px 0px;
margin:0px 0px 0px 0px;
}
li {
padding:0px 0px 0px 5px;
margin:0px 0px 0px 18px;
list-style-type: none;
}
.li1 {
list-style-image: url(images/icon_pfeil.gif);
}
.li2 {
list-style-image: url(images/icon_pfeil2.gif);
}
Mein HTML sieht folgend aus:
<ul>
<li class="li1"><a href="" class="subnav">1.Ebene</a></li>
<li class="li1"><a href="" class="subnav">1.Ebene</a></li>
<ul>
<li class="li2"><a href="" class="subnav">2.Ebene</a></li>
</ul>
<li class="li1"><a href="" class="subnav">1.Ebene</a></li>
<li class="li1"><a href="" class="subnav">1.Ebene</a></li>
</ul>
Kann mir jemand helfen, damit es in IE und Firefox gleich aussieht!
Danke tempo74
@@tempo74:
Mein HTML sieht folgend aus:
<ul>
<li class="li1"><a href="" class="subnav">1.Ebene</a></li>
<li class="li1"><a href="" class="subnav">1.Ebene</a></li>
<ul>
<li class="li2"><a href="" class="subnav">2.Ebene</a></li>
</ul>
<li class="li1"><a href="" class="subnav">1.Ebene</a></li>
<li class="li1"><a href="" class="subnav">1.Ebene</a></li>
</ul>
Das ist kein valides HTML. 'ul' darf kein Kind von 'ul' sein. Das hätte dir ein Validator auch verraten.
So wird ’n Schuh draus:
~~~html
<ul>
<li class="li1"><a href="" class="subnav">1.Ebene</a></li>
<li class="li1"><a href="" class="subnav">1.Ebene</a>
<ul>
<li class="li2"><a href="" class="subnav">2.Ebene</a></li>
</ul>
</li>
<li class="li1"><a href="" class="subnav">1.Ebene</a></li>
<li class="li1"><a href="" class="subnav">1.Ebene</a></li>
</ul>
Live long and prosper,
Gunnar
Danke Gunnar!
Hätte ich draufkommen müssen.
lg
tempo74