nicht angemeldet
Puzzlespiele mit Tabellen
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
-
Hi Andreas
Leider habe ich hier keinen NS4 bzw NS6 und kann das nicht testen.
Aber aus meiner Erfahrung ;-)
würde ich sagen, dass die einzige Möglichkeit NS4 zu so einer Sache zu "überreden" ist, die Breite der mittleren Spalte auf 99% zu setzen. Dann macht NS (und soweit ich weiss auch alle anderen Browser) die mittlere Spalte so breit wie es geht (Füllt also in der Praxis den "Rest" der Seite auf). Damit müsste die Seite eigentlich so aussehen wie du willst.
Zu der doppelverlinkung der Bilder kann ich leider nichts sagen, weil ich jetzt dringend zu Frau und Kindern ins Bett muss und keine Zeit mehr habe darüber nachzudenken ;-))
Tschau Holger
PS alle Anführungszeichen in HTML müssen! meines Wissens nach in doppelten Anrührungszeichen geschrieben werden. Will heissen: Die Browser verstehen deinen Quelltext nur weil sie so Fehlertolerant sind.-
Hallo Holger,
Aber aus meiner Erfahrung ;-)
würde ich sagen, dass die einzige Möglichkeit NS4 zu so einer Sache zu "überreden" ist, die Breite der mittleren Spalte auf 99% zu setzen.Vielen Dank, das funktioniert so tatsächlich! Auf jeden Fall
komme ich so einer browserunabhängigen Lösung schon deutlich
näher... ;-)Viele Grüße
Andreas
-