Wieder einmal stehe ich vor einem Problem welches mir partout nicht weichen will und für dass ich, bis jetzt, auch keine Lösung gefunden habe
Ich möchte ein Navigations Menu erstellen, welches mittels CSS und Listen Elementen, sowohl in der ersten als auch in der zweiten Ebene, Horizontal verläuft.
Mein Problem liegt bei der zweiten Ebene, egal was ich versucht habe, sie wird immer vertikal aufgelistet.
Was mache ich falsch oder anders gesagt: was muss ich machen damit auch die zweite Ebene horizontal dargestellt wird ?
Vielen Dank schon mal im voraus
Code:
Hier den Code den ich soweit habe:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="de" xml:lang="de">
<head>
<style type="text/css">
#navi, #navi ul { list-style-type:none; margin:0; padding:0; }
#navi li { width:128px; float:left; }
#navi li ul { display:none; }
#navi li:hover ul { display:block; }
</style>
<!--[if IE]>
<style type="text/css" media="screen">
#menu ul li {float: left; width: 100%;}
</style>
<![endif]-->
<!--[if lt IE 7]>
<style type="text/css" media="screen">
body {behavior: url(csshover.htc); font-size: 100%;}
#menu ul li a {height: 1%;}
}
</style>
<![endif]-->
</head>
<body>
<ul id="navi">
<li><a href="#">Willkommen</a></li>
<li><a href="#">Über uns</a>
<ul>
<li><a href="#">Angebot</a></li>
<li><a href="#">Geschichte</a></li>
<li><a href="#">Jobs</a></li>
</ul>
</li>
<li><a href="#">Projekte</a>
<ul>
<li><a href="#">Alpha</a></li>
<li><a href="#">Beta</a></li>
<li><a href="#">Gamma</a></li>
</ul>
</li>
<li><a href="#">Impressum</a></li>
</ul>
</body>
</html>