Tabellen Hintergrundbild Probleme in alten Browsern HTML Beispiel Download

Hintergrundbilder in Tabellen

HOME

DOWNLOAD

BEISPIEL

ZURÜCK

SITEMAP

Trick für NS4 für IE und NS6 nicht erforderlich

Tabellen-Hintergrundbild Probleme in älteren Browsern

Grafik-Hintergründe in Netscape-Tabellen sind ~~ein Problem~~ eine Herausforderung! Anders als im Explorer beginnt NS 4.x nämlich in jeder Tabellenzelle aufs neue, das Image darzustellen.

Im NS4.x würde das dann so aussehen (Bild muss geladen sein)

Zelle 2	Zelle 3	Zelle 4
Zelle 6	Zelle 7	Zelle 8
Zelle 10	Zelle 11	Zelle 12
Zelle 14	Zelle 15	Zelle 16

Die Lösung

Die eigentliche Tabelle wird in eine 2. äußere Tabelle gesteckt die lediglich eine Zelle hat. Das Hintegrundbild wird nicht in der Inneren Tabelle sondern in der (einzigen) Zelle der äußeren Tabelle definiert. Für die innere Tabelle bestimme ich als Hintergrund ein transparentes Image (das kann Netscape 4.x meinethalben in jeder Zelle wiederholen).

Lösungsbeispiel 1 gekachelt

Lösungsbeispiel 2 passend

Das funktioniert auch bis auf eine Ausnahme!
Für weitere Info unten mehr aber erst mal den Quellcode.

Sie benötigen ein transparentes Image (GIF)

transpixel.gif (rechtsklicken - speichern)

HTML-Code für die Tabelle


<!-- äußere Tabelle -->
<table background="motorrad.jpg" bgcolor=""
border="0" cellspacing="0" cellpadding="0" width="500">
<tr>
<td>
<!-- innere Tabelle -->
<!-- hintergrundgrafik ist ein transparentes Image -->
<table background="../images/transpixel.gif"
width="100%" border="x" cellspacing="x" cellpadding="x">
<tr>
<td>
Inhalt der Tabellenzelle steht hier
</td>
</tr>
...

Nächste Herausforderung Hintergrundfarbe

Nur was ist im nächsten Beispiel anders ? Trotz des gleichen HTML-Codes wie beim Beispiel im Lösungsvorschlag, wird hier das Hintergrundbild (im NS 4.x zumindest) nicht korrekt angezeigt!

Die beiden Tabellen stehen innerhalb einer dritten Tabelle (zum Beispiel zur Formatierung) und schon tut sich ein neues Problem auf. Die Hintergrundfarbe der übergeordneten dritten Tabelle "leuchtet" durch.

Die Fehlersuche für einige Browserversionen möchte ich Ihnen ersparen, deshalb dieser Hinweis.

Einige Seitenbesucher sehen hier 3 verschachtelte Tabellen mit hellblauem Hintergrund. Lediglich in den beiden Schmalen horizontalen Rändern kann man kleine Fragmente des Hintergrundbildes sehen. Das bedeutet: In der Tabelle der mittleren Ebene ist das Bild sichtbar. Nur liegt die innere Tabelle darüber.

Wird für die nächst höhere, umschließende (dritte) Tabelle eine Hintergrundfarbe bestimmt, sehen Besucher mit dem NS4.x das in der zweiten Tabelle definierte Hintergrundbild nicht!

Abhilfe

Zur Fehlerbehebung in der 3. Tabelle folgendes Attribut einfügen:

<table bgcolor="" ...

Lösungsbeispiel ansehen

Für Besucher mit dem IE sieht hier alles normal aus: Im IE sehen sie hier eine 3. äußere Tabelle mit hellblauem Hintergund, in der die beiden anderen Tabellen stehen. Das Hintergrundbild der mittleren Tabelle ist auch in der inneren Tabelle sichtbar.

Zelle 2	Zelle 3	Zelle 4
Zelle 6	Zelle 7	Zelle 8
Zelle 10	Zelle 11	Zelle 12
Zelle 14	Zelle 15	Zelle 16

NACH OBEN