Gunther: float: left|right nur im Netscape 7 und Opera 6 richtig?

Beitrag lesen

Hallo zusammen!

Dem 'Trend' zum CSS-Layout folgend, tüfftel ich gerade an verschiedenen Ansätzen herum. Dabei bin ich u.a. auf folgendes Problem gestoßen, wozu ich im Archiv keine hinreichende Antwort gefunden habe (wohl einige Beiträge zu Teilproblemen).

Doch hier zunächst einmal der Quellcode:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"
 "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>float-problem</title>
<style type="text/css">
<!--
html,body {height: 100%; width: 100%; margin: 0px; padding: 0px; background-color: #fff; color: #000;}
#div1  {width: 25%; background-color: #ccc; color: #000; margin: 0px; padding: 0px; float: left;}
#div2  {width: 75%; height: 300px; background-color: #999; color: #000; margin: 0px; padding: 0px;}
-->
</style>
</head>
<body>
<div id="div1">
Innerhalb von DIV-1
</div>
<div id="div2" style="">
Außerhalb von DIV-1,<br>
dafür aber innerhalb von DIV-2
</div>
</body>
</html>

Ich habe extra mal die ganze Datei gepostet, damit auch ersichtlich wird, dass der MSIE 6 in den Standard-compliant Mode geschaltet wird (dazu gleich noch etwas).

Getestet habe ich die Datei mit folgenden Browsern auf einem Windows-System:

  • MSIE 6 SP1
  • NS 7.0 rv 1.0.1 de
  • Opera 6.04 B 1135
  • Opera 7.02 B 2668

Die angezeigten Ergebnisse erstaunen mich ein wenig. Beim MSIE 6 gibt es 2 verschiedene Varianten. Im Standard-compliant Mode (also mit obigem Code) liefert er als Anzeige beide DIV's untereinander am linken Fensterrand. Ohne in den Standard-compliant Mode umzuschalten, zeigt er DIV 2 zwar neben DIV 1 am oberen Rand an, aber dafür mit einer 'Lücke' zwischen den DIV's (gibt's im Archiv schon mal, aber IMHO ohne ausreichende Antwort), und DIV 2 hat nur noch eine Breite von ca. 50%.

Opera 7 zeigt beide DIV's in der vorgegebenen Größe nebeneinander am oberen Fensterrand an (wobei 25% plus 75% auch nicht gleich 100% zu sein scheint -> Rundungsfehler?).

Nur Opera 6 und Netscape 7 zeigen es IMHO richtig an.

Habe ich etwas falsch gemacht, falsch verstanden, oder ist es einfach ein Browser-Problem?
Es wäre auch nett, wenn mir jemand bitte sagen könnte, wie es auf anderen Plattformen und/oder in anderen Browsern angezeigt wird.

Vielen Dank für euer Feedback -

Gruß Gunther