für ein Projekt möchte ich eine dynamische Navigation erstellen, die von Layout so aussehen soll:
http://img864.imageshack.us/i/grid.gif/
Ich verzweifle mittlerweile daran und befürchte, dass es dafür vielleicht gar keine CSS-Lösung gibt. Vielleicht weiß ja jemand von euch einen Rat?!
Ich habe mir schon überlegt einen Trenner o.ä. für die Navigationspunkte in einer neuen Spalte einzufügen, hat aber leider nicht so geklappt. Weiß jemand was? Hat jemand von euch eine Idee dazu?
Das hier ist der derzeitige, relevante HTML-Code:
- Code: Alles auswählen
<ul>
<li><a href="#">Navipunkt</a>
<ul>
<li><a href="#">Subnavipunkt</a></li>
<li><a href="#">Subnavipunkt</a></li>
<li><a href="#">Subnavipunkt</a></li>
<li><a href="#">Subnavipunkt</a></li>
<li><a href="#">Subnavipunkt</a></li>
</ul>
</li>
<li><a href="#">Navipunkt</a>
<ul>
<li><a href="#">Subnavipunkt</a></li>
<li><a href="#">Subnavipunkt</a></li>
<li><a href="#">Subnavipunkt</a></li>
</ul>
</li>
<li><a href="#">Navipunkt</a>
<ul>
<li><a href="#">Subnavipunkt</a></li>
<li><a href="#">Subnavipunkt</a></li>
<li><a href="#">Subnavipunkt</a></li>
<li><a href="#">Subnavipunkt</a></li>
<li><a href="#">Subnavipunkt</a></li>
<li><a href="#">Subnavipunkt</a></li>
<li><a href="#">Subnavipunkt</a></li>
<li><a href="#">Subnavipunkt</a></li>
<li><a href="#">Subnavipunkt</a></li>
<li><a href="#">Subnavipunkt</a></li>
<li><a href="#">Subnavipunkt</a></li>
</ul>
</li>
<li><a href="#">Navipunkt</a>
<ul>
<li><a href="#">Subnavipunkt</a></li>
<li><a href="#">Subnavipunkt</a></li>
<li><a href="#">Subnavipunkt</a></li>
<li><a href="#">Subnavipunkt</a></li>
<li><a href="#">Subnavipunkt</a></li>
</ul>
</li>
<li><a href="#">Navipunkt</a>
<ul>
<li><a href="#">Subnavipunkt</a></li>
<li><a href="#">Subnavipunkt</a></li>
</ul>
</li>
</ul>
CSS-Code:
- Code: Alles auswählen
ul { font:normal 12px Arial,sans-serif; list-style:none; width:600px;}
ul li { float:left; width:200px; }
ul li ul { width:200px; }

