Ich habe hier ein Menü gebastelt.
Als erstes würde ich gerne mal den code posten und eure Meinung dazu wissen. Lasst ihr das so durchgehen oder habt ihr vielleicht einen verbesserungsvorschlag? Ich hab das Menü noch nicht in allen Browsern getestet bin also noch unsicher ob es auch wirklich überall funktioniert.
Hier der code:
CSS:
- Code: Alles auswählen
<style>
#wrapGlobalNav {margin:0;padding:0;width:100%;min-width:753px;width:expression(document.body.clientWidth < 800 ? "753px" : "100%" );
background:url('globalNavBg.png') top left repeat-x;height:45px;}
#globalNavigation ul {margin:0;padding:0;}
#globalNavigation li {float:left;list-style:none;line-height:35px;margin:0 30px 0 0;padding:0 10px 1px 10px;}
#globalNavigation a {display:block;padding:0;margin:0;color:#D90081;text-decoration:none;}
#globalNavRight {float:right;width:25px;height:45px;padding:0;margin:0;background:url("globalNavRight.png") top left no-repeat;}
#globalNavLeft {float:left;width:25px;height:45px;padding:0;margin:0;background:url("globalNavLeft.png") top left no-repeat;}
#wrapGlobalNav .active{background:url('globalNavBgActive.png') top left repeat-x;}
</style>
HTML:
- Code: Alles auswählen
<div id="wrapGlobalNav">
<div id="globalNavLeft"></div>
<div id="globalNavRight"></div>
<ul id="globalNavigation">
<li><a href="indexLoggedIn.jsp">Start</a></li>
<li class="active"><a href="profile">Meine Seite</a></li>
<li><a href="events">Meine Termine</a></li>
<li><a href="friends">Meine Freunde</a></li>
<li><a href="messages">Postfach</a></li>
</ul>
</div>
So! Jetzt hätte ich da allerdings noch eine Frage, und zwar hat jeder der Links auch noch "Unterlinks". Diese sollen in einer zweiten Zeile erscheinen.(Im Bild der rote Text)
Wie kann ich das umsetzen? Hat da jemand eine Idee? Ich komme da kein Stück weiter! Würde mich über Hilfe wirklich sehr freuen!
Damit ihr es euch besser vorstellen könnt hier noch ein Bild:

