Probleme mit IE bei Positionierung

Status
Nicht offen für weitere Antworten.

DJauie

Mitglied
Probleme mit IE bei Positionierung von Hoovermenü

Hi!

Ich habe mir folgendes Layout gestrickt:
http://www.mf-online.de/test/home.htm

Die Leiste unter dem Banner stellt die Menüleiste dar. Soweit so gut...diejenigen, die den Link jetzt mit FF angeklickt haben, denken sich wohl, was ich hier überhaupt fragen will, doch super...aber die IE-User wissen, was los ist :)

Und jetzt die Frage: Warum zeigt der IE die Menüleiste so an?

Ich hatte die vorher so, dass jeder Punkt eine feste Größe hatte. Dies habe ich durch padding-left: und padding-right: erreicht. Damit hatte auch der IE keine Probleme. Aber dafür war immer rechts neben der Leiste ein kleiner Platz frei, weil die Größen eben auch durch verschiedene Inhalte nicht aufgegangen sind zur Gesamtbreite.
Dann habe ich das umgestellt und jedem Punkt "width: 20%" gegeben. Hab ja 5 Punkte und daher die 20%. Sieht im FF wunderbar aus, so wie ichs will. Aber IE kommt damit überhaupt nicht zurecht...Wie kann ich das trotzdem machen, dass ich 5 einheitlich breite Menüpunkte hab und alle zusammen maximal 700px breit sind? Ich hab auch schon probiert statt den 20% einfach width: 140px anzugeben, aber das bringt genauso wenig Erfolg.
Ich schätze mal, das liegt daran, dass der IE diese Art von Hoover-Effekt nur in einem <a> - Tag erkennt und daher auch keine Größenangaben kapiert, oder? Wenn ich aber einen div-Tag drum rum mach, dann sieht das sch* aus... :(

Ich hoffe jemand hat ne Lösung...

Es soll so aussehen, wie man es mit dem FF sieht...nur halt auch für IE...und für eine Info wie es in anderen Browsern aussieht wäre ich auch dankbar...ich hab nur die beiden zur Auswahl...
 
Zuletzt bearbeitet:
Opera, Mozilla, Netscape und Firefox zeigen dasselbe, nur der IE eben nicht. Ich hatte das selbe Problem auch vor ein paar Wochen, habe allerdings auch leider keine Lösung gefunden.

greetz
 
Das Listenmenü hab ich mir auch schon angeschaut, aber ich hätte es gerne so, wie es im FF aussieht.

Ich hab jetzt einen Code gefunden, mit dem zumindest der hoover-Effekt überall gleich aussieht und auch die Größe passt, da der Tag dann ein div ist.

Code:
<div onMouseOver="this.style.backgroundColor='#666666'"
onMouseOut="this.style.backgroundColor='#555555'">

Um beim Click auch noch zu verlinken, muss noch folgendes angegeben werden:
Code:
onClick="MM_goToURL('parent','test.php');return document.MM_returnValue"
 
Zuletzt bearbeitet:
Hallo,

der MSIE kann mit Prozentangaben grundsätzlich nicht umgehen, ist meine Erfahrung. Mit a:hover hat das nix zu tun.

Aber warum gibst du nicht eine feste Breite in Pixel an für jeden Link? Du hast doch eine feste Breite für #container. Also: 700px/5 = 140px! Das müsste eigentlich funktionieren.

Das padding der Link-Boxen solltest du dann allerdings rechts und links auf 0 setzen, da der IE und auch Opera in der HTML-transitional-Variante, die du benutzt, das padding nämlich innerhalb der Breite berechnet, während der korrekt arbeitende Firefox es dazu rechnet. Hast du z.B. padding mit 10px definiert, werden die Boxen in Firefox (und in der HTML-strict-Variante auch in IE6 und Opera) 160px breit. Mehr zum Thema »Box-Modell« findest du bei selfHTML. Lohnt sich, zu lesen.

Schöne Grüße
27apricot.
 
Danke für deine Antwort.
Ich hatte anfangs eine Breite drin, der FF hat die auch sehr richtig interpretiert und da sah ja alles wunderbar aus, aber dem IE war das wurscht...genauso wie padding...das ging irgendwie nicht :(

Ich reg mich sowieso dauernd über den sch*** IE auf...wenn ich meinen CSS angepasst habe und im FF ansehe, sieht der meistens genau so aus, wie ich ihn gerne hätte...aber dann die Ernüchterung im IE... :rolleyes:
 
Status
Nicht offen für weitere Antworten.
Zurück