Andreas Pflug: Puzzlespiele mit Tabellen

Beitrag lesen

Hallo Forum,

auch, wenn es an sich ein alter Hut ist -
ich bin gerade dabei, mich mit Tabellen und insbesondere Netscape 4.7
zu erfreuen. Hintergrund: In einer Online-Dokumentation kommen
diverse Quellcode-Beispiele vor, die mit Hilfe von kleinen
Grafiken "eingerahmt" werden sollen. Die Tabelle hat - abgesehen
von zwei Trennlinien - ein 3x3-Format, wobei in der mittleren Zelle
das Quellcode-Beispiel stehen soll.
Der Aufbau ist in etwa so:

grafik_11.gif  |  konst. Hintergrundfarbe |  grafik_31.gif
----------------------------------------------------------
                 Trennlinie (colspan=3)
----------------------------------------------------------
grafik_12.gif  |  Quelltextbeispiel in    |  grafik_32.gif
               |  <pre>...</pre> mit      |
               |  konst. Hintergrundfarbe |
----------------------------------------------------------
                 Trennlinie (colspan=3)
----------------------------------------------------------
grafik_13.gif  |  konst. Hintergrundfarbe |  grafik_33.gif

Dabei soll die Breite des Randes jeweils durch die
Bildabmessungen der gifs pixelgenau festgelegt sein.
Die mittlere Spaltenbreite soll entsprechend des
verfügbaren Platzes floaten, ebenso die mittlere Zeilenhöhe
entsprechend der Textlänge.

Das ganze soll nun auf möglichst vielen Browsern funktionieren, auch
z.B. Netscape 4.7. Was mir dazu bisher einfiel ist folgendes:

<TABLE border='0' cellspacing='0' cellpadding='0' width='100%'>
<!--  Oberer Rahmenrand  -->
<tr>
  <td width='26px'><img src='icons/box_ul.jpg' border='0'></td>
  <td width='1600px'><img src='icons/blue_1x1.jpg' border='0' ></td>
  <td width='65px'><img src='icons/box_ur.jpg' border='0'></td>
</tr>
<!--  Trennlinie  -->
<tr>
  <td colspan='3' height='1px' background='icons/black_1x1.jpg'>
    <img src='icons/black_1x1.jpg'>
  </td>
</tr>
<!--  Mittlerer Bereich mit Text -->
<tr>
  <td width='26px' background='icons/box_left.jpg'>
    <img src='icons/box_left.jpg' border='0'>
  </td>
  <td class='boxcontent' background='icons/blue_1x1.jpg'>
    <br><pre> ... hier der Text ... </pre>
  </td>
  <td width='65px' background='icons/box_right.jpg'>
   <img src='icons/box_right.jpg' border='0'>
  </td>
</tr>
<!--  Trennlinie  -->
<tr>
  <td colspan='3' height='1px' background='icons/black_1x1.jpg'>
    <img src='icons/black_1x1.jpg'>
  </td>
</tr>
<!-- Unterer Rahmenrand -->
<tr>
  <td><img src='icons/box_ll.jpg' border='0'></td>
  <td><img src='icons/blue_1x1.jpg' border='0'></td>
  <td><img src='icons/box_lr.jpg' border='0' hspace='0'></td>
</tr>
</TABLE>

Nun enthält dies einige merkwürdige Workarounds, z. B. funktioniert
es in Netscape 4.x nicht ohne die mittlere Pixelangabe von 1600px.
Auch die teilweise Doppelverlinkung von Bildern teils als Background
teils als <img> ist auf merkwürdige Wechselwirkungen der
Netscape vs. IE-Anpassung zurückzuführen. Unter Mozilla funktioniert
es ausserdem gerade mal wieder nicht.

Meine Frage ist daher, ob jemand ein derartiges Konstrukt in einer
fehlerfreieren bzw. kompakteren Version schon mal angewendet oder
irgendwo gesehen hat. Das Thema Netscape und Tabellen ist ja auch
im Archiv schon zahlreich durchgekaut worden, jedoch habe ich
diesen speziellen Fall darunter nicht gefunden.

Viele Grüße

Andreas