Horizontale Navigation ausrichten

[Wolf Larsen]

Hallo Zusammen,

mich graut immer vor dem Ausrichten horizontaler Navigationen wie hier: Der Idealzustand wäre, dass wenn man einen Menüpunkt umbenennt, sich auch die Navigation mit Margins/Paddings etc. wieder neu ausrichtet. Das ist Wunschdenken. Nehmen wir mal das Beispiel. Hier wäre es fein, wenn die Navi vorne mit dem richtigen Abstand loslegt und am Ende auch wieder der gleiche Abstand ist. Bei Kontakt ist rechts jetzt mehr Freiraum. Das Hover geht dann daneben. Jetzt kann man das mit Hin und Her in die Nähe das weißen Randes drängen. Da man den Navigationspunkten jeweils einen Abstand gibt, kann das klappen oder nicht. Pixelgenau haut es eh kaum hin. Dann scheinen Schriftgrößen eine Rolle zu spielen. 14 Punkt schaut im Firefox Mac gut aus, in Firefox PC wird die Schrift viel dicker und umbricht die Navigation. Auch die Abstände sind von Browser zu Browser unterschiedlich. Ist es in Firefox Mac ausgerichtet, ist es am Safari Mac viel zu weit drüben und im IE ist der Rand zu schmal.

Wie kriegt man denn sowas in den Griff?

Danke,
Wolf

[tblumrich]

Hi.

Ich rätsel jetzt schon 5 Minuten über deinen Post.
Du verlinkst 2x genau die gleiche Seite, auf der weit und breit keine horizontale Navigation zu sehen ist...

Verstehe ich was falsch, arbeitest du an der Seite, ist da was schief gelaufen oder kannst du das mal erklären?

Gruß
Thomas

[MiTsch]

Hallo Wolf Larsen,

ich muss da tblumrich zustimmen:

Du verlinkst 2x genau die gleiche Seite, auf der weit und breit keine horizontale Navigation zu sehen ist...

Außerdem zeigt mir dein Menü bei den nicht angefahrenen Menüpunkten in IE eine weiße Schrift auf weißem Untergrund !

Viele Grüße
MiTsch

[armin41]

Hallo Wolf,

ungefähr weiß ich, was du für Fragen hast.

Dazu ganz kurz:

In

ul padding: 0; margin: 0; list-style-type: none;

Dann fängt die Navigation erst mal ganz vorne an (float:left weglassen!)

In li die richtigen Abstände eintragen und wichtig (statt float):

display:inline;

.

In li a dann die Abstände für das Hovern eintragen. Und dann in li a:hover nur noch den Hintergrund eintragen.

Da in li die Abstände zwischen den Menüpunkten stehen, ist eine Änderung des Menüpunktes egal, weil es dann mit dem Hovern nichts zu tun hat.

Wenn das nicht zur Lösung führt, dann brauchen wir mehr Details.

Gruß

Armin

[Wolf Larsen]

Danke für Eure Antworten Leute,

ich hatte tatsächlich noch an der Navigation rumgetan, weil es mir keine Ruhe ließ.

Das Problem ist doch, wenn man eine Navi mit Schrift pixelgenau "austreiben" will, dann kann die Navigation umbrechen, wenn eine Helvetica auf einem System etwas weiter läuft oder Bold dicker dargestellt wird. Ich bin nochmal in mich gegangen, bin zurück zur Original-Theme-Navi und habe diese angepasst. Diese Navi umgeht das optische Problem dadurch, dass eine Art Split-Navi gemacht wird. Viele Punkte stehen links und 1-2 Punkte stehen ganz rechts, hier. Der Platz zwischen der Split-Navi, hier zwischen Neuigkeiten und Kontakt, wird für einen Überlauf genutzt, wird etwas kleiner oder größer, aber die Sache bricht nicht um. So sieht die Navi durch den Kompromiss immer recht gut aus.

Ich könnte mir sonst nicht vorstellen, dass eine horizontale Navi überall genau passt.

Wolf

[charlie_2011]

Hallo,

hätte gerne, dass sich die Sublevelnavigation beim Mouseover unterhalb des Toplevels darstellt. Also linksbündig z.B. zum 2ten Link im Toplevel. Geht das überhaupt? Und wenn ja wie?

Gruß Charlie