Tim Tepaße: Netscape 4.x und sein Problem mit Bildern (kniffelig)

Hallo!

Ich verzweifel hier langsam, vielleicht kann mir einer der Netscape-Cracks helfen.

Ich muß etwas ausholen dafür, sorry.

Ich habe eine Seite erstellt, bei der der Inhalt in absolut positionierte divs drin ist. Um nun den damit meist etwas überforderten Netsie auszutricksen habe ich sämtliche absoluten Positionierungen in eine extreme CSS-Datei ausgelagert, die der Netscape wegen seiner mangelhaften CSS-Unterstützung (Ja, ich weiß, JSSS und so, bitte keine Anfeindungen ;-) nicht referenzieren kann. Der CSS Bereich im Head sieht wie folgt aus:

<link rel="stylesheet" href="text.css" type="text/css">
<style type="text/css">
<!--
 @import url(position.css);
//-->
</style>

In der Datei text.css stehen nur allgemeine Text-Formatierungen drin, Schriftart, Größe, etc.
In der Datei position.css stehen dann die absoluten Positionierungen drin, aufgrund der Referenzierung via @import findet der Netscape die Datei nicht (Alle anderen 5-er Browser schon) und positioniert nicht, sondern schreibt das alles zeilenweise untereinander - die (hier nicht) positionierten divs meine ich.

Eigentlich ist diese Variante auch ideal - die Menschen ohne CSS, wie z.B. Braille-Display-Benutzer haben das ganze dann zeilenweise untereinander, die Netscape-Benutzer haben in derselbern Variante Zugriff auf den Inhalt (und kriegen dazu noch als erstes den Text eines mit display:none in der position.css verborgenen divs, daß sie sich doch bitte - um die Seite "richtig" dargestellt zu kriegen - einen aktuelleren Browser besorgen sollen ;o) Aber das gehört nicht hierher.)

Es funktionierte auch ganz gut, bis ich beschloß, in eines der positionierten Divs ein Bild einzufügen.

_Eigentlich_ sollte man meinen, Netscape macht das wie gehabt, zeigt in der Zeilenweise-Variante den Inhalt des divs, wie bei den mit Text gefüllten divs, an, beendet das div, springt danach in die nächste Zeile und macht dort weiter.

Puh, ich rede wieder zuviel.

Lange Rede, kurzer Sinn, mein Problem ist, daß dieses Machwerk von einem Browser das Bild schön anzeigt, aaaber das Bild den Inhalt des nächsten divs in der Reihenfolge überdeckt, sprich dieses nicht räumlich tiefer als das Bild-div liegt, sondern darunter.

Ich habe schon mit diversen Dingen rumgespielt, z-Index (alles nat. in der text.css), margin-bottom, mich im Web umgeguckt und nichts gefunden - Im Archiv konnte ich nicht suchen - irgendwie ist die Archivsuche verschwunden.

Hier noch mal der Quellcode:

<body>

<div class="loser">
Der Text der normalerweise nicht zu sehen ist
</div>

<div class="logo">
<img width="" height="" etc>
</div>

<div class="nav">
text zur navigation>
</div>

(Anmerkung:
Eben diese Navigation isses, die überdeckt wird.)

<div class="content">
Viel Inhalt - im Moment nur Blindtext
</div>

</body>

Und das isses.
All die Positionierungen stecken in den verschiedenen Klassen, diese sind in der position.css an die Netscape, wie schon erwähnt, nicht rankommt.

Und das einzige Problem ist, wenn dieses Bild erscheint. Bei purem Text erscheint da nichts.

Fragen:

  • Ist das vielleicht irgendein Versionskonflikt in der 4er Serie des NN? Ich habe hier 4.75
  • Hat die 4er Serie generell ein Problem mit Bildern innerhalb eines divs?
  • und so weiter.

Würde mich freuen, wenn sich jmd. damit beschäftigt

Gruß, Tim

  1. Hallo Tim,

    wer das Problem noch nicht hatte, der glaubt es oft nicht, zu welchen Unfähigkeiten Browser in der Lage sind. Jeder hat da so seine Gemeinheiten. Die Workarounds für den NS sind nur ein wenig aufwendiger.

    Dein Problem ist mir bekannt. Genauso designerfreundlich verhält dieses Prunkstück bei Tabellen in Verbindung mit line-height. Wundervoll verschachtelte Collagen sind damit möglich. Bloß warum sehen alle anderen Browser das anders?

    Beholfen habe ich mir, indem ich jedes Bildchen in einen Abstz gepackt habe. Also mit <p> ... </p> und <br> den Browser zur sequentiellen Anordnung gezwungen habe. Ob das für dich eine Lösung ist, weiß ich nicht. Denn dazu müßtest du Grafik und nachfolgenden Text in einem Layer anordnen.

    Viele Grüße
      Kess

    1. Gun'Tach miteinand,

      Beholfen habe ich mir, indem ich jedes Bildchen in einen Abstz gepackt habe. Also mit <p> ... </p> und <br> den Browser zur sequentiellen Anordnung gezwungen habe. Ob das für dich eine Lösung ist, weiß ich nicht. Denn dazu müßtest du Grafik und nachfolgenden Text in einem Layer anordnen.

      Bei mir ging es auch mit folgendem bloeden Trick:

      <img src="meinimg" align="left">
      <br clear="all">

      HTH,
      Gero

      1. Morgen!

        Geros Trick funktioniert wunderbar - Danke.

        Da denkt man immer, man kennt sich halbwegs mit Netscape 4.x aus, dann kommt was neues.

        Gruß vom nun zur UNi hetzenden Tim