Hallo Patrick,
Folgende Probleme treten auf:
- Das Menu wird nicht wie der Inhaltscontainer als Top, Main und Bottom im Ganzen dargestellt, sondern verteilt sich horizontal.
- Das Content-Panel ist an der falschen Position. Mit float:middle verdeckt es aber den Header.
Du hast in jedem Teil deines menus (top, Main-Menu, Bottom) ein float: left stehen, dadurch verteilen die sich logischerweise alle nach rechts.
Du könntest z.b. das ganze menu in ein Div packen, diesem ein float:left geben (damit der Main-Content brav nach rechts floatet) und die ganzen float: lefts im Menu selbst löschen.
Sekundär, noch unwichtig:
- Die Schrift wird über den schwarzen Rändern der Panels dargestellt. Logisch, ich habe auch keine anderen Anweisungen gegeben. Wie lauten sie?
Gib dem "li" mal ein "margin-left: 10px" (oder so), sollte funktionieren (im Firefox DOM-Inspector tut es jedenfalls)
Gruss,
Joerg