Böse Überraschung beim Test im IE
Wolfgang
- browser
Hallo,
ich habe die Homepage eines Vereins zur Pflege übernommen.
Jetzt habe ich Sie unter dem IE 6 und 7 angeschaut und bin erschrocken.
Mitten auf der Seite wird ein Scrollbalken angezeigt.
Sicher ist es nicht einfach bei dem z.T. unübersichtlichen Code die Ursache zu finden.
Offensichtlich liegt es an der Angabe von "body { overflow:scroll; } " in
der CSS-Datei "speziell.css".
Wenn ich aber die Angabe weglasse, "hüpft" das Bild hin und her, je nachdem ob ein Scrollbalken da ist oder nicht.
Wie könnte ich dies bereinigen?
Die Seite heißt dfcradolfzell.de.
Besten Dank für Eure Unterstützung (trotz anstehendem Fußballspiel)
Wolfgang
PS. Positive Kritik am Aufbau/Code ist zwar willkommen, aber zunächst ist mir wichtiger, dass dieser komische Effekt weg ist.
Hi,
Offensichtlich liegt es an der Angabe von "body { overflow:scroll; } " in
der CSS-Datei "speziell.css".
Wenn ich aber die Angabe weglasse, "hüpft" das Bild hin und her, je nachdem ob ein Scrollbalken da ist oder nicht.
Wie könnte ich dies bereinigen?
In dem du die Angabe per CSS-Hack vor älteren IEs versteckst, und das „Hüpfen“ das sein lässt, was es ist - eine absolut unwesentliche Kleinigkeit, mit der Nutzer alter IEs dann im Zweifelsfalle leben müssen.
MfG ChrisB
Hallo,
das war ja eine superschnelle Reaktion!
In dem du die Angabe per CSS-Hack vor älteren IEs versteckst, und das „Hüpfen“ das sein lässt, was es ist - eine absolut unwesentliche Kleinigkeit, mit der Nutzer alter IEs dann im Zweifelsfalle leben müssen.
Ich werde mal schauen, wie ich das verstecke! Von Hacks habe ich schon viel gelesen es aber noch nie angewandt. Aber in Selfhtml werde ich wohl entsprechendes finden - sonst melde ich mich noch einmal.
Also Danke
Hi,
In dem du die Angabe per CSS-Hack vor älteren IEs versteckst,
Ist folgendes dann korrekt:
1. In der Std. CSS-Datei keine Overflow-Angabe
2. Nach dem Aufruf dieser CSS-Datei die Angabe
<!--[if gt IE 7]>
<style type="text/css">body { overflow:scroll; } </style>
<![endif]-->
Ich nehme an, dass die nicht IE-Browser das if-statement ignorieren und die obige style-Angabe interpretieren.
Eleganter wäre es aber vermutlich, in der Standard CSS
body { overflow:scroll; }
anzugeben und diese Angabe für den IE <= 7 zu löschen.
Aber wie mache ich dies?
<!--[if lte IE 7]>
<style type="text/css">body { overflow:NONE; } </style>
<![endif]-->
overflow:none gibt es ja nicht. Müsste ich da auto angeben?
Weitere Frage:
In dem vorliegenden Falle muss ich ja im HTML diesen if unterbringen.
Gäbe es auch die Möglichkeit innerhalb der CSS-Datei diese IE-spezifischen Angaben zu machen?
Gruß
Wolfgang
Hi,
overflow:none gibt es ja nicht. Müsste ich da auto angeben?
Das wäre der Defaultwert, ja.
Gäbe es auch die Möglichkeit innerhalb der CSS-Datei diese IE-spezifischen Angaben zu machen?
Das Stichwort habe ich schon genannt - CSS Hacks.
MfG ChrisB
Lieber Wolfgang,
<!--[if gt IE 7]>
<style type="text/css">body { overflow:scroll; } </style>
<![endif]-->Ich nehme an, dass die nicht IE-Browser das if-statement ignorieren und die obige style-Angabe interpretieren.
umgekehrt wird ein Schuh daraus:
Obige drei Zeilen werden von nicht-IEs als ein einziger XML- bzw. HTML-Kommentar interpretiert und komplett ignoriert. Das If-Statement wird nur von IE-Browsern erkannt und der Kommentar nicht als solcher behandelt und deshalb nicht ignoriert.
Eleganter wäre es aber vermutlich, in der Standard CSS
body { overflow:scroll; }
anzugeben und diese Angabe für den IE <= 7 zu löschen.
Eleganter ist es meiner Meinung nach, das Stylesheet ausschließlich für moderne Browser zu schreiben, um erst danach für die noch von mir unterstützten Versionen antiker IEs Spezialstylesheets zu inkludieren, damit Darstellungsfehler einigermaßen behoben werden.
Man muss den IE ja nicht verwenden.
overflow:none gibt es ja nicht. Müsste ich da auto angeben?
Ja. Das ist der default-Wert, den man angeben muss, wenn man eine vorherige Änderung wieder rückgängig machen möchte.
Liebe Grüße,
Felix Riesterer.