nicht angemeldet
IE6 mit float und Hintergrundbild
Moin,
ich stelle gerade einen Internetauftritt von Frame-Und-Tabellen-Design auf CSS um. Leider ist es dann doch nicht so ganz einfach, da ich doch immer wieder am IE neue Probleme feststelle. Leider ist er aber nun mal DER Browser meiner Gäste.
Ich habe mal ein einfaches Beispiel gebaut, dass das Problem zeigt:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
<title>Test</title>
</head>
<body >
<div style="background-image: url(http://de.selfhtml.org/html/dateiweit/anzeige/background.jpg);">
<div style="float:left; margin-right:20px; margin-bottom:10px" ><img src="http://de.selfhtml.org/html/grafiken/anzeige/denker.png" width="70" height="137" alt="Text?"></div>
<div>
<h1 style="margin: 0; padding: 0; font-size: 18pt;">Oder denkt er an ...?</h1>
<p style="margin: 0; padding: 0; font-size: 13pt;">Aber denken Sie sich nicht zuviel dabei. Es ist ja schließlich gar kein Text - es ist ja eine Grafik! Aber das hier, das ist richtiger Text. Und er fließt sogar, nämlich um die Grafik.</p>
<p style="margin: 0; padding: 0; font-size: 13pt;">Aber denken Sie sich nicht zuviel dabei. Es ist ja schließlich gar kein Text - es ist ja eine Grafik! Aber das hier, das ist richtiger Text. Und er fließt sogar, nämlich um die Grafik.</p>
</div>
<hr style="clear: both;">
</div>
</body>
</html>
Wenn der IE6 diese Seite öffnet, dann sieht man den Text ersteinmal nicht. Ändert man die Größe des Fensters, dann wird am Text ab und zu mal der untere Rand des Textes abgeschnitten.
Das Problem konnte ich festmachen am "background-image" und an der Höhe des Textes. Lasse ich das Bild weg, dann ist kein Problem da.
Ist der Text kleiner als die Höhe des Bildes tritt das Problem auf. Es ist weg, wenn ich mit mit "height" die Höhe des umfließenden Textes explizit angebe. (Letzteres funktioniert ja nur wieder im IE, aber nicht im Firefox oder Opera.)
Noch extremer ist es (bis auf weiteres) auf http://www.feuerwehr-holtsee.de/Neu/index.php zu sehen. (BITTE keine Diskussion über das Blaulicht!)
Ich kann natürlich eine Browserweiche bauen (PHP steht zur Verfügung), aber vielleicht hat ja jemand eine bessere Idee und/oder einen Workaround oder findet doch noch einen Fehler.
Claus
-
hi,
Wenn der IE6 diese Seite öffnet, dann sieht man den Text ersteinmal nicht. Ändert man die Größe des Fensters, dann wird am Text ab und zu mal der untere Rand des Textes abgeschnitten.
Klingt nach dem Guillotine Bug.
gruß,
wahsaga--
/voodoo.css:
#GeorgeWBush { position:absolute; bottom:-6ft; }-
Moin,
Klingt nach dem Guillotine Bug.
Eher nicht. Ich habe mir deinen Link angesehen und glaube, dass es ein anderer Fehler ist (, wenn es denn überhaupt ein Fehler ist). Wenn ich es richtig verstanden habe, dann tritt der Guillotine-Bug bei Links auf, wenn das Element nicht ge"clear"t wurde. In meinem Beispiel sind keine Links und ein clear folgt.
Claus
-
-
Moin,
Noch extremer ist es (bis auf weiteres) auf http://www.feuerwehr-holtsee.de/Neu/index.php zu sehen.
Das war natürlich Quatsch. Ich hatte noch einen "Probierstand" im Netz stehen. Jetzt habe ich die Seite wieder in dem Zustand, dass man es sehen kann. Einfach das IE-Fenster so groß machen oder die Schrift so klein einstellen, dass die Überschrift "Herzlich Willkommen ..." nur zwei Zeilen hat und dann einmal F5 für [Ansicht][Aktualisieren] drücken.
Claus
-
Moin,
nach der Lektüre von http://www.positioniseverything.net/explorer/peekaboo.html
komme ich zum Schluss, dass es sich wohl um den Peek-a-boo-Bug handelt. Kann das bitte jemand von den CSS-Experten bestätigen bzw. denm widersprechen?Danke
Claus