horizontales menu im IE gebrochen

[hoppelmoppel]

Ach mir geht des Menu schon ziemlich auf den Senkel .. das mit den Prozentangaben will nicht hinhauen ..

Irgendwie kommt mir vor dass der IE nur bis zur 2ten Kommastelle etwas interpretiert .. und die anderen interpretiern auch nicht alles richtig. Beim Safari siehts mit % immer scheisse aus .. also .. kurz gesagt .. es suckt

 

[2nd]

Bei mir geht es durch das Umstellen der Breitenangaben auf %:

http://www.freelancr.biz/media/examples/html_css/horizontalesMenu/horizontalesMenuProzent.htm

Habe es im Safari und IE6 getestet. 2 Werte sind verändert: em -> %

2nd

 

[hoppelmoppel]

Ja.. ist mir auch klar warum. Mach mal um die <a> nen border herum. Dann siehste mein Delemma. Da ich ja den hover Effekt ausnützen möchte .. sollte das Menu auch buendig sein. Und genau das ist mein Problem, dass es nicht überall bündig abschließt mit dem nav Element.

kannst ja mal mit FF guggen .. eventuell wirds ja richtig dargestellt (hoppelmoppel.blogdns.net)

 

[2nd]

Jup, Borders werden (genauso wie horizontale Paddings) auf die Gesamtbreite von Blocklevel-Elementen draufgerechnet. Das muss natürlich berücksichtigt werden. Dann musst Du die Breitenanagaben in einem anderen Format machen, z. B. em. Das übergeordnete Element kann ja trotzdem eine %-Breite habe.

2nd

 

[hoppelmoppel]

Ne des hat nichts mit den borders zu tun. Ich wollte dir nur den Abstand zwischen den 6ten Element und dem Parent zeigen.

 

[hoppelmoppel]

Hmm, hat jemand ne Idee wie ich das gefixed bekomme .. so dass die Menupunkte zusammen 100% der Breite ausmachen, ohne fixe Groessen, fixe positions, fixe Anzahl von Menu Items (also kein 60em, durch 6 Teilen ).

 

[2nd]

Mit margin-right: 20px; kannst Du ohne Breitenangaben arbeiten.

2nd

 

[hoppelmoppel]

Hmm, wie meinste das .. mit margin-right kann ich ja nur fixieren wieviel Aussenabstand das jeweilige Element hat.

 

[2nd]

Wenn Du die Breitenangaben wegnimmst, floaten die Blockelemente direkt nebeneinander und hintereinander. Deswegen margin-right ohne Breitenangaben. So bleibst Du frei von der Rechnerei etc..

2nd

 

[hoppelmoppel]

Ja aber so sind ja dann die Element nicht alle Gleich groß .. und auf 100% zu kommen is dann ja auch nicht grad einfach .. und wenn es ein fluid Layout sein soll .. funktionierts so doch auch nich oda?

Bin aba sehr dankbar für deine Ratschläge und die Zeit die du da investierst.

 

[msslovi0]

Generell empfehle ich keine Browserweiche. Wofür auch? Gerade für den IE 5/6 gibt es bei echten Problemen gut dokumentierte Workarounds, die sich mit wenigen Zeilen zusätzlichem CSS bei standardkonformen XHTML unkompliziert nutzen lassen - ohne Browserweichen und ähnliche Tricks.

Ist jetzt etwas am Thema vorbei, aber das ist ja offensichtlich eh schon durch

Unter Ausnutzung der Möglichkeiten von CSS ist es am sinnvollsten, eine Kombination aus beidem zu nutzen. Wobei ich die Begrifflichkeit 'Browserweiche' in dem Zusammenhang für falsch halte, sie hat IMHO im CSS-Umfeld nichts verloren.

Der sinnvollste Weg ist es, ein CSS für die guten Browser zu erstellen und dann die für die unterschiedlichen IE-Versionen erforderlichen Änderungen (und nur die) jeweils in eine zusätzliche CSS-Datei zu packen. Diese wird dann im HTML über Conditional Comments eingebunden. Ein Vorgehen, das im übrigen auch Microsoft so empfiehlt.
Denn damit ist zum einen gewährleistet, dass die guten Browser nicht unnötiges CSS laden müssen und zum anderen, dass Workarounds, die beispielsweise für den IE 6 notwendig sind, von neueren Versionen ignoriert werden, was sonst teilweise zu unvorhergesehenen Resultaten führt (und was aber nicht heißt, dass für IE 7 nicht doch wieder eigene Hacks notwendig sind, er ist noch nicht 100% 'gut').

Matt