Unterschiedliche Darstellung in IE und Mozilla
Stefan
- css
Hallo zusammen,
dieses Thema ist in ähnlicher Form hier im Forum u.a. auch von mir schon zur Sprache gekommen. Nichtsdestotrotz stehe ich beim Erstellen von Seiten mit grafischen Elementen, die eine exakte Position benötigen, immer wieder vor dem Problem, dass IE (ab 5.5) und Mozilla die Seiten unterschiedlich darstellen, obwohl der Code DTD HTML 4.01 Transitional genügt. Dieses Problem tritt insbesondere dann auf, wenn Grafiken innerhalb von <div> oder <td> verwendet werden. Außerdem erscheint es mir erwähnenswert, dass ich Schriftarten und Schriftgrößen (in pt) im Stylesheet festlege bzw. festgelegt habe.
Kann mir jemand einen Tipp geben, was alles beachtet werden muss, damit Seiten in IE und Mozilla gleich aussehen, ohne dass eine Browserweiche verwendet werden muss.
Vielen Dank im voraus,
Gruß
Stefan
Moin auch,
IE 5 kann (im Gegensatz zu IE 6) keine fixed positions. Die zerschießen dann das Bild.
Workaraound: div[id] benutzen.
Siehe auch
http://selfaktuell.teamone.de/tippstricks/css/browserweiche/index.htm
Gruß von der Ostsee
Hanjo
Moin!
IE 5 kann (im Gegensatz zu IE 6) keine fixed positions. Die zerschießen dann das Bild.
Auch der IE6 kann kein position:fixed. Der Mac-IE 5.1 kann's - dafür versagt der an anderen Stellen, die die Windows-Version beherrscht.
- Sven Rautenberg
Hi Sven,
IE 5 kann (im Gegensatz zu IE 6) keine fixed positions. Die zerschießen dann das Bild.
Auch der IE6 kann kein position:fixed. Der Mac-IE 5.1 kann's
AFAIK aber auch nur stark eingeschränkt, d.h. es treten dann andere Bugs auf (http://jendryschik.de/wsdev/css/fixed/#implementierung). Deshalb schließt man besser alle M$IEs aus, oder setzt es gleich ganz anders um ;)
Jedenfalls gibt es auch für M$IE/Mac eine eigene CSS-Weiche, falls diese nötig sein sollte:
http://www.sam-i-am.com/testsuite/css/mac_ie5_hack.html
LG Orlando
Hi Hanjo, hi Sven, hi Orlando,
sorry, aber so richtig was anfangen kann ich mit euren Antworten leider nicht. In der ursprünglichen Fragestellung war nicht von einem Problem mit "position: fixed" die Rede. Vielmehr davon, dass ich immer wieder ein Problem damit habe, dass Seiten mit grafischen Elementen, die mittes <div> und/oder <table> positioniert werden, in IE (ab Vers. 5.5) und Mozilla unterschiedlich dargestellt werden.
Wäre schon, wenn ich noch weiteres Feedback bekomme würde.
Gruß
Stefan
Hi Sven,
IE 5 kann (im Gegensatz zu IE 6) keine fixed positions. Die zerschießen dann das Bild.
Auch der IE6 kann kein position:fixed. Der Mac-IE 5.1 kann's
AFAIK aber auch nur stark eingeschränkt, d.h. es treten dann andere Bugs auf (http://jendryschik.de/wsdev/css/fixed/#implementierung). Deshalb schließt man besser alle M$IEs aus, oder setzt es gleich ganz anders um ;)
Jedenfalls gibt es auch für M$IE/Mac eine eigene CSS-Weiche, falls diese nötig sein sollte:
LG Orlando
Hi Stefan,
sorry, aber so richtig was anfangen kann ich mit euren Antworten leider nicht. In der ursprünglichen Fragestellung war nicht von einem Problem mit "position: fixed" die Rede. Vielmehr davon, dass ich immer wieder ein Problem damit habe, dass Seiten mit grafischen Elementen, die mittes <div> und/oder <table> positioniert werden, in IE (ab Vers. 5.5) und Mozilla unterschiedlich dargestellt werden.
was meinst du denn mit "unterschiedlich"? So kann ich leider nur raten. Wenn es darum geht, dass der M$IE die Breite/Höhe von DIVs bei Verwendung von margin/padding/border falsch berechnet, hast du dir den Box-Model-Bug eingefangen. Der M$IE rechnet bei falschem oder nicht vollständigem Doctype oder vorhandener XML-Deklaration falsch, weil er sich dann nicht im standards-compliant-mode befindet.
</archiv/2002/10/26502/#m144586>
http://msdn.microsoft.com/library/en-us/dnie60/html/cssenhancements.asp
http://gutfeldt.ch/matthias/articles/doctypeswitch.html
http://www.w3.org/TR/REC-CSS2/box.html#box-dimensions
Wäre schon, wenn ich noch weiteres Feedback bekomme würde.
Eine Adresse und eine genauere Fehlerbeschreibung wäre hilfreich.
LG Orlando
Hi Orlando,
die Links haben mir teilweise schon geholfen. Vielen Dank!
In einem konkreten Fall jedoch leider noch nicht.
Eine Adresse und eine genauere Fehlerbeschreibung wäre hilfreich.
http://www10.brinkster.com/goorps/test/company.asp
Inhaltlich ist wenig darauf zu sehen. Die Seiten sind auch noch nicht fertig. Hauptproblem, wie unschwer zu erkennen, ist das Menu. Im IE 6 wird es so dargestellt wie ich es mir vorstelle, in Mozilla 1.0 nicht (Das soll jetzt nicht heißen das der IE besser als Mozilla darstellt.) Die Zeilen geraten aus welchem Grund auch immer im Mozilla breiter als im IE, womit die Position der Navigationsgrafiken nicht mehr stimmt. Woran liegt das? Ich weiß es leider nicht. Ich hoffe, du kannst mir helfen.
Viele Grüße
Stefan
Hi Stefan,
Hauptproblem, wie unschwer zu erkennen, ist das Menu. Im IE 6 wird es so dargestellt wie ich es mir vorstelle, in Mozilla 1.0 nicht
Hier hat Mozilla Recht.
(Das soll jetzt nicht heißen das der IE besser als Mozilla darstellt.)
Ich weiß, es ist umgekehrt ;)
Die Zeilen geraten aus welchem Grund auch immer im Mozilla breiter als im IE, womit die Position der Navigationsgrafiken nicht mehr stimmt. Woran liegt das?
Welchen M$IE hast du denn? Du beschreibst nämlich den typischen Box-Model-Bug, der M$IE rechnet die Breite falsch, er stellt das DIV *inklusive* Rahmen, Innen- und Außenabstand mit der definierten Breite dar, richtig wäre es, wenn er sie außen *dazuzählt*. Laut
http://msdn.microsoft.com/library/en-us/dnie60/html/cssenhancements.asp
sollte der M$IE6 deine Seite korrekt (im standards-compliant-mode) darstellen, da du den Doctype inklusive Adresse angegeben hast. Verwendest du den M$IE 5.x? Ich sehe auch keine großen Abweichungen zwischen dem M$IE, Mozilla und Opera, wobei bei letzterem der horizontale blaue Strich unter den Bildern fehlt.
LG Orlando
Hi Orlando,
Welchen M$IE hast du denn? Du beschreibst nämlich den typischen Box-Model-Bug, der M$IE rechnet die Breite falsch, er stellt das DIV *inklusive* Rahmen, Innen- und Außenabstand mit der definierten Breite dar, richtig wäre es, wenn er sie außen *dazuzählt*. Laut
http://msdn.microsoft.com/library/en-us/dnie60/html/cssenhancements.asp
sollte der M$IE6 deine Seite korrekt (im standards-compliant-mode) darstellen, da du den Doctype inklusive Adresse angegeben hast. Verwendest du den M$IE 5.x? Ich sehe auch keine großen Abweichungen zwischen dem M$IE, Mozilla und Opera, wobei bei letzterem der horizontale blaue Strich unter den Bildern fehlt.
Ich verwende M$IE6 SP1. Der Unterschied der Seitendarstellung liegt v.a. darin, dass der Zeilenabstand des Menus auf der linken Seite, welches eine Tabelle innerhalb eines <DIV> ist, im Mozilla breiter gerät als im IE und es dadurch zu Fehlern bei der Darstellung der vertikalen blauen Linie kommt. Ich denke der Fehler liegt eher in der Tabelle als beim <DIV>.
Viele Grüße
Stefan
Hi Orlando,
habe soeben ein Update von Mozilla 1.0 auf 1.1 durchgeführt,
und siehe da: die Seiten werden korrekt dargestellt.
Hauptproblem, wie unschwer zu erkennen, ist das Menu. Im IE 6 wird es so dargestellt wie ich es mir vorstelle, in Mozilla 1.0 nicht
Hier hat Mozilla Recht.
Scheinbar doch nicht?!
Auch wenn ich sehr froh bin, dass es nun funktioniert, kannst du mir bitte noch erklären, wo denn das Problem gelegen haben könnte?
Viele Grüße
Stefan
Hi Stefan,
habe soeben ein Update von Mozilla 1.0 auf 1.1 durchgeführt,
und siehe da: die Seiten werden korrekt dargestellt.
ach so, dann war doch Mozilla der Schuldige. Ich habe allerdings 1.0 und trotzdem keinen Unterschied zum M$IE.
Auch wenn ich sehr froh bin, dass es nun funktioniert, kannst du mir bitte noch erklären, wo denn das Problem gelegen haben könnte?
Kann sein, dass dein 1.0-Profil gesponnen hat, das ist eine Schwachstelle, wenn man mehrere Versionen installiert (immer ein eigenes Profil anlegen!).
LG Orlando
Hi Orlando,
vielen Dank für deine Hilfe und Mühe!
Gruß
Stefan
Hi Stefan,
habe soeben ein Update von Mozilla 1.0 auf 1.1 durchgeführt,
und siehe da: die Seiten werden korrekt dargestellt.
ach so, dann war doch Mozilla der Schuldige. Ich habe allerdings 1.0 und trotzdem keinen Unterschied zum M$IE.
Auch wenn ich sehr froh bin, dass es nun funktioniert, kannst du mir bitte noch erklären, wo denn das Problem gelegen haben könnte?
Kann sein, dass dein 1.0-Profil gesponnen hat, das ist eine Schwachstelle, wenn man mehrere Versionen installiert (immer ein eigenes Profil anlegen!).
LG Orlando
Hallo,
was meinst du denn mit "unterschiedlich"? So kann ich leider nur raten. Wenn es darum geht, dass der M$IE die Breite/Höhe von DIVs bei Verwendung von margin/padding/border falsch berechnet, hast du dir den Box-Model-Bug eingefangen. Der M$IE rechnet bei falschem oder nicht vollständigem Doctype oder vorhandener XML-Deklaration falsch, weil er sich dann nicht im standards-compliant-mode befindet.
um welche IE geht es dabei?
Anders gefragt, wenn ich per doctype den IE6 "richtiger" einstellen
kann, hilft das vielleicht noch dem einheitlichen Code für Mozilla,
aber was ist dann mit IE5 und IE 5.5 ?
Grüsse
Cyx23
Hi Cyx23,
um welche IE geht es dabei?
um den 6er, selbst mit SP1.
Anders gefragt, wenn ich per doctype den IE6 "richtiger" einstellen
kann, hilft das vielleicht noch dem einheitlichen Code für Mozilla,
aber was ist dann mit IE5 und IE 5.5 ?
Sollte es Probleme geben ;) hilft entweder "Tantek's Hack" (http://pixels.pixelpark.com/~koch/hide_css_from_browsers/tantek/), oder ein entsprechender Conditional Comment. Besser natürlich, die Seiten werden trotz Box-Model-Bug korrekt dargestellt, das kann man durchaus erreichen. So spart man sich dann die leidige Korrektur der Werte.
LG Orlando