✔ Horizontales CSS-Menü mit Tabs

[Necro_nomicon]

Hallo!

Ich habe ein horizontales Menue mit einzelnen Tabs. Das funktioniert auch.
Allerdings sind die einzelnen Bezeichnungen der Menuepunkte, wie auch die Anzahl (hat sich aber erst spaeter rausgestellt) viel zu lang und zuviele, dass es zwangslaeufig zu einem Umbruch kommt.
Durch die Breitenangabe kann ich das nun verhindern, jedoch ist jedes Tab verschieden gross. Selbst wenn ich das in em angebe, ist eine Loesung mit scrollbalken nicht wirklich toll.

Wozu wuerdet ihr mir raten?
Ueberlappende Tabs, dass man drueberfahren muss, damit man weiss was es alles gibt.
Gibt es bessere Loesungen?

Und laesst ihr den Umbruch nie zu, bei kleinerer Fenstergroesse?

 

[Maik]

Hi,

was die hohe Anzahl der Menüpunkte betrifft, sollte überprüft werden, ob sich diese nicht durch eine geschickte Gruppierung in einzelnen Untermenüs verringern lässt.

Ansonsten solltest du eine vertikale Menüausrichtung in Betracht ziehen, falls das horizontale Menü den Rahmen der Seitenbreite sprengt, denn ein horizontales Scrollen der Seite ist "unvorteilhaft", um die übrigen Menüpunkte der Navigation einsehen zu können. Möglichwerweise fällt es ja dem einen oder anderen Seitenbesucher auch garnicht auf, dass sich das Menü zur rechten Seite fortsetzt.

mfg Maik

 

[Necro_nomicon]

Danke fuer deine Antwort.

Ich kenne auch kein horizontales Menue, dass ploetzlich 2-reihig wird.

Das Problem dabei ist jedoch, dass es sich bereits um das Untermenue handelt. Das Hauptmenue ist vertikal. Leider ist auch das Auswechseln von Ober- und Untermenue nicht moeglich.

Das Problem sind die langen Namen, die allerdings fachspezifische Begriffe sind.
Ich habe das ganze jetzt so gestaltet, dass wenn man ueber die Tabs faehrt unten ein beschreibender Text dazu eingeblendet wird (sprechende Navigation), dadurch konnte ich den einen oder anderen Begriff etwas abkuerzen.

Ich koennte sonst nur aus manchen Menuepunkten vielleicht Symbole im Tab machen, weil ich ja eh die sprechende Navigation habe.
Oder klingt das eher unueblich?

Trotzdem muesste ich die Navigation doch irgendwie fixieren von der Breite oder, damit bei einem kleineren Fenster nicht ein Umbruch passiert, weil das sieht dann natuerlich haesslich aus.

 

[Maik]

Dann handelt es sich aber nicht um ein horizontales Tabmenü, sondern der Beschreibung nach wohl eher um ein sog. Flyout-Menü, dessen Untermenüs sich nach links oder rechts in einer Zeile öffnen, wie z.B. http://www.cssplay.co.uk/menus/flyout_horizontal.html. Vielleicht wäre hier stattdessen http://www.cssplay.co.uk/menus/flyoutt.html dienlicher.

Das Umbrechen der Menüpunkte beim Runterskalieren der Fensterbreite sollte eigentlich das Einrichten einer Mindestbreite für das Gesamt-Layout der Seite unterbinden.

mfg Maik

 

[Necro_nomicon]

Nein, ist eher sowas:
http://sura1.wordpress.com/category/css-menue/
allerdings mit Abstand dazwischen ohne Schraege

unten wird eben eingeblendet der Text wie bei :
http://www.smashingmagazine.com/2008/02/26/navigation-menus-trends-and-examples/

Das mit der Mindestbreite habe ich umgsetzt. Danke!

Fuer die langen Worte (20-40 Zeichen) werde ich wirklich auf Symbole bzw. kleine Icons setzen. Immerhin steht drunter eh auch die Erklaerung. 9 Untermenues kann man einfach nicht wirklich viel anders unterbrignen.

 

[Maik]

Ich hab keinen blassen Schimmer, wo im ersten Link in den vier Beispielen das Hauptmenü vertikal ausgerichtet ist, geschweige denn, von welchem der unzählig vorgestellten Menüs du im zweiten Link sprichst, aber das ist jetzt ehrlich gesagt für mich auch nicht von großem Interesse, wenn du das Problem eh mit Icons aus der Welt räumst.

mfg Maik