Hallo Thomas,
Beim vierten Beispiel auf Deiner Testseite zeigt uebrigens auch der MS IE 5.5 Win lauter "einsen" (1.) an. Der ist sonst sattelfester mit den Listennumerierungen als sein Vorgaenger (5.0) und Nachfolger (6.0).
Ja, das war beabsichtigt. ;) Ich habe lediglich vergessen, es zu erwähnen. Ich bin dabei auf einen weiteren Bug im MSIE 6 gestoßen, danke auch für den Hinweis, dass es auch im MSIE 5.5 diesbezüglich Probleme gibt.
Ich habe mal eine weitere Testseite gemacht:
http://www.morgain.ch/de2/cd6.htm
http://www.morgain.ch/css/screen6.css
Ja, die Varianten ab inklusive CD-Block 6.4 funktionieren im Bezug auf die Listen (und nur diesbezüglich ;)) interoperabel, soweit ich es testen kann (Opera 6.05/7, MSIE 6, Mozilla 1.2/1.3b, jeweils Win98).
Was nicht funktioniert, ist das float. Im Opera 6.05 wird die Grafik von CD-Block 6.7 unterhalb der Liste angezeigt. Im Mozilla 1.2 und 1.3b bei CD-Block 6.5 bis 6.7. (Getestet auf: 1024x768 Pixel, volle Fensterbreite, keine horizontale Einschränkung, gleich große Schriftarten.)
Das lässt sich lösen, denn das liegt an der festen Breite für das p. Diese muss folglich zunächst entfernt werden, da es sowieso nur für die Grafik gelten soll, nicht für das p-Element, denn dieses umfasst das floatende ol-Element - wenn man dem p die width nimmt und ihm einen Rahmen gibt, erkennt man es.
Weiterhin zeigt der Opera 6.05 ol und p vertikal nicht auf derselben Höhe an, auf das p-Element wirkt das margin-bottom des vor dem div liegenden p-Elements, auf das ol-Element jedoch nicht.
Dies wiederum lässt sich auf zwei Arten lösen: Entweder man deaktiviert margin-top des div-Elements (dürfte meines Wissens Standard sein) und auch margin-bottom des darüberliegenden p-Elements und gibt dem p-Element nur padding-bottom. Die andere Möglichkeit ist, dass margin-bottom des p-Elements deaktiviert wird (auf Null gesetzt wird) und nur margin-top des div-Elements den Abstand ausmacht. Dadurch werden das p und ol im div auf gleicher Höhe angezeigt.
Leider ist der Text in einigen LI-Elementen etwas laenger und geht nun ueber zwei Zeilen.
Hm, da kannst du höchstens an der Breite des ol-Elements drehen.
Da macht der MS IE (aber z.T. auch Opera) ploetzlich komische Sachen - die zweite Zeile ist weniger tief eingerueckt als die erste.
Die zweite Zeile? Hm, das kann ich nicht beobachten, oder ich missverstehe ich, mir ist nur das oben beschriebene mit der rechten Spalte aufgefallen, aber die Zeilen der Liste werden in den mir zu Verfügug stehenden Browsern einheitlich und wie gewünscht eingerückt.
Ich hoffe natuerlich noch immer auf die Universalloesung, die auch in diesen Schrott-Browsern funktioniert.
Naja, ob ich die habe, weiß ich nicht, aber unter Beachtung der genannten Probleme ist http://home.t-online.de/home/dj5nu/fanhost/css-liststyle3-float.html recht interoperabel. Ich habe mich dabei an den Varianten 6.5 bis 6.7 versucht, es ginge auch sicherlich anders herum, also dass das p-Element mit dem Bild zuerst kommt und mit float ausgezeichnet wird.
Grüße,
Mathias