Horizontales Menu für Wordpress(theme)

[Rafael]

Hallo liebes Forum,
ich hätte da mal ein Problem.

Erst einmal der Zustand wie es mal aussehen soll, dann HTML + CSS Code und dann noch ein bisschen geweine.

<div id="sidebar">  
<div class="menu-hauptnavigation-container">  
<ul id="menu-hauptnavigation" class="menu">  
  <li id="menu-item-18" class="menu-item menu-item-type-post_type menu-item-18"><a href="http://www.willi-janek.de/wordpress/?page_id=13">Unternehmen</a>  
  
         <ul class="sub-menu">  
              <li id="menu-item-19" class="menu-item menu-item-type-post_type menu-item-19"><a href="http://www.willi-janek.de/wordpress/?page_id=15">Team</a></li>  
              <li id="menu-item-28" class="menu-item menu-item-type-post_type menu-item-28"><a href="http://www.willi-janek.de/wordpress/?page_id=20">Geschichte</a></li>  
         </ul>  
  </li>  
  
  <li id="menu-item-31" class="menu-item menu-item-type-post_type menu-item-31"><a href="http://www.willi-janek.de/wordpress/?page_id=22">Leistungen</a>  
         <ul class="sub-menu">  
           <li id="menu-item-29" class="menu-item menu-item-type-post_type menu-item-29"><a href="http://www.willi-janek.de/wordpress/?page_id=24">Angebot</a></li>  
           <li id="menu-item-30" class="menu-item menu-item-type-post_type menu-item-30"><a href="http://www.willi-janek.de/wordpress/?page_id=25">Kosten</a></li>  
           </ul>  
  </li>  
  
</ul></div>

Dieser Code wird von Wordpress generiert.

#sidebar {  
	width: 860px;  
  
	}  
  
#sidebar ul {  
	margin: 0;  
	padding: 0;  
	list-style-type: none;  
	list-style-image: none;  
	}  
  
#sidebar li {  
	display:inline;  
	float:left;  
	}  
  
ul.sub-menu {  
	overflow:auto;  
	display: block;  
	}  
  
  
  
#sidebar ul li a {  
	text-decoration:none;  
	margin: 4px;  
	padding: 5px 20px 5px 20px;  
	color: blue;  
	background: pink;  
	}  
  
#sidebar ul li a:hover {  
	color: purple;  
	background: yellow;  
	}  

Das ist mein derzeitiger CSS Code.

Nun will ich dem Menu sagen, "alle ul.hauptnavigation li's in eine reihe - die ul.sub-menu's schön brav in blöcken darunter".

Aber ich bekomm es einfach nicht hin. ich habs mit float rechts und links, overflow:auto, inline, block und bin langsam mit meinem latein am ende. ist es denn überhaupt möglich den vorgegebenen Code von wordpress so zu formatieren wie es in dem bild aussieht? der link zur aktuellen version ist angeheftet.

ps: nein, das ist keine auftragsarbeit. ich arbeite in einem familienunternehmen

[seVes]

Vielleicht hast Du dies noch nicht gelesen/gefunden:

http://de.selfhtml.org/css/layouts/navigationsleisten.htm#geteilt

Bin vorhin auch drauf gestoßen, wegen mittiger Ausrichtung. ;-)