Der Internet Explorer und die Stylesheets

Beide Probleme traten bei der Darstellung des Menüs auf. Das Menü dieser Seiten ist als eine Aufzählung realisiert. Die einzelnen Menüpunkte sind also li-Elemente. Während der Arbeiten am Stylesheet und am Layout der Seite habe ich eine Testseite von Hand geschrieben. Wie üblich habe ich dabei natürlich den HTML-Code schön leserlich formatiert und jedes li-Element in eine einzelne Zeile geschrieben. Schließlich darf die Formatierung des HTML-Codes in einer Webseite keinen Einfluss auf die Darstellung der Seite im Browser haben.

Diesen Teil der HTML-Spezifikation habe die Entwickler des Internet Explorers anscheinend überlesen - böse Zungen behaupten, dies sei nicht der einzige Teil. Auf jeden Fall wurden im IE immer Abstände eingebaut, für die es keinerlei Grund gab. Alle anderen Browser haben das Menü korrekt dargestellt. Interessant ist, dass mit der Stil-Angabe "border: 1px" die Abstände auch im IE vernünftig waren, "border: none;" jedoch führte wiederum zu der falschen Darstellung.

Das zweite Problem hat mich mehr Zeit gekostet und ist noch kurioser. Wer sich das Menü dieser Seiten anschaut, wird feststellen, dass die Schriftfarbe wechselt, wenn man mit der Maus über einen Eintrag fährt. Dabei muss man noch nicht einmal den Text selbst überstreichen. Es reicht, die entsprechende Zeile zu treffen. Erreicht wird dies durch die Angabe "display: block;" in der Stildefinition der Menü-Links.

Soweit, so gut. Zumindest für Browser, die nicht aus Redmond kommen. Der Internet Explorer jedoch hat sich zunächst geweigert, die gesamte Zeile für den Link zu benutzen. Ich hatte einige Dinge ausprobiert, aber er blieb standhaft. Ich wollte schon fast aufgeben, als ich gemerkt habe, dass auf einer Seite der Internet Explorer das Menü so darstellte, wie ich das wollte, auf den anderen jedoch nicht. Auf beiden Seiten war das verwendete Stylesheet das selbe. Auch der HTML-Code war identisch. Wo also lag die Ursache?

Die Lösung des Problems: Das Menü liegt in einem div-Container, der eine Breite zugewiesen bekommt. In der Datei, die korrekt verarbeitet wurde, war unterhalb des Menüs aber noch innerhalb des div-Containers ein Icon eingebunden. Aus irgendwelchen Gründen hat dieses Icon einen Einfluss darauf, wie der Internet Explorer das darüber liegende Menü behandelt.

Selbstverständlich ist es vollkommen egal, wie groß das Icon ist, ob es überhaupt sichtbar ist, und welche Stildefinitionen dafür gelten. Hauptsache, es gibt ein Icon. Dann ist der IE glücklich und tut, was er soll. Mit Fragen nach Logik sollte man ihm aber lieber nicht kommen.

 Was wäre das Leben einfach ... - 21-05-06 22:27