Netscape 6.x + Bilder in Tabellen mit Padding 0
Karsten Schramm
- html
Hi,
ich habe meine Seite versucht für alle Browser gut aussehen zu lassen, mit IE 5.0-6 und Opera 6 ist mir das auch gelungen, zusätzlich ist sie HTML 4.01 Trans-konform. Wo ich jetzt ein Problem habe: wenn man sich meine Seite http://www.Yajirobi.de mit Netscape 6.2.1 (ich nehme an, das Problem geht runter bis 6.0) ansieht, wird der obere Teil durch einen dicken Balken vom unteren abgetrennt.
Das Problem ist auch schon lokalisiert. Wenn eine Tabellenreihe tr nur aus td's mit Bildern auf Zellhöhe bestückt ist, fügt NS 6.2.1 unten einen Balken hinzu, egal wie oft man zellpadding=0 und/oder style="padding:0px;" angibt.
Das gleiche Problem habe ich dadurch mit meinen Buttons (siehe auch erste Seite unten)
Wer kann helfen?
ich habe meine Seite versucht für alle Browser gut aussehen zu lassen, mit IE 5.0-6 und Opera 6 ist mir das auch gelungen, zusätzlich ist sie HTML 4.01 Trans-konform. Wo ich jetzt ein Problem habe: wenn man sich meine Seite http://www.Yajirobi.de mit Netscape 6.2.1 (ich nehme an, das Problem geht runter bis 6.0) ansieht, wird der obere Teil durch einen dicken Balken vom unteren abgetrennt.
Für das Problem habe ich zumindest eine unsaubere Lösung gefunden: den Browser durch weglassen des Doctyle in den sloppy-mode zwingen. Eine saubere suche ich aber auch dringend.
btw. könntest du die Links *etwas* weniger rot machen? Die sind so kaum als solche wahrzunehmen...
Das Problem ist auch schon lokalisiert. Wenn eine Tabellenreihe tr nur aus td's mit Bildern auf Zellhöhe bestückt ist, fügt NS 6.2.1 unten einen Balken hinzu, egal wie oft man zellpadding=0 und/oder style="padding:0px;" angibt.
Es liegt nicht an der Tabelle, sondern an den divs. Ich garatiere nichts, aber wenn Du das div mit einem margin:0px; und/oder padding:0px; versiehst muesste das eigentlich klappen.
Ben
hallo Karsten,
du hast dir ganz offensichtlich sehr viel Mühe gemacht. Dein Problem besteht aber darin, daß du viel zu viele DIV's eingesetzt hast, die eigentlich gar keinen Sinn machen. Ich hatte mir deinen Code mal eben runtergeladen, alle DIV's rausgestrichen, und schon war das "Problem" völlig behoben. Wenn du wegen der Positionierung unbedingt ein DIV brauchst, dann nimm ein einziges, auf dem alle deine Tabellen ( übrigens auch viel zu viele einzelne Tabellen, manche könntest du dir sparen) liegen.
Warum mußt du denn überhaupt Grafiken so "zerhacken", daß ein Teil in einer Tabelle und ein anderer in einer anderen Tabelle liegt ?
Lösungsvorschlag: nimm nur ein DIV zur Positionierung, gib dem aber auch noch ein ID und einen Namen, und setze da eine "blinde" Tabelle rein, in der du dann alle anderen Tabellen ohne individuelle Positionierung und mit den "padding=0"-Vorgaben verschachteln kannst. Das scheint zumindest bei einem ganz schnellen und flüchtigen Probedurchlauf bei mir das Problem zu beheben.
Grüße aus Berlin
Christoph S.
hallo Karsten,
Ich hatte mir deinen Code mal eben runtergeladen, alle DIV's rausgestrichen, und schon war das "Problem" völlig behoben.
hat bei mir leider absolut nix geholfen, ausser dass es jetzt linksbündig ist
Warum mußt du denn überhaupt Grafiken so "zerhacken", daß ein Teil in einer Tabelle und ein anderer in einer anderen Tabelle liegt ?
im Topbereich ist das historisch gewachsen, ursprünglich sollte die Seite auch horizontal stretchbar sein, wie sie es vertikal ist
Wie gesagt, alle DIVs gecancelt und trotzdem noch das Problem. Wenn man die Borders einschaltet, sieht man auch ganz deutlich, das es irgendwie mit dem unteren Rand der Grafik zum unteren Rand der Tabelle zusammenhängt :-/
Hier mal 2 Testpages und 3 Screenies, wie es bei mir aussieht
Ohne Borders: http://home.arcor.de/yajirobi/test/test1.htm
mit: http://home.arcor.de/yajirobi/test/test2.htm
IE: http://home.arcor.de/yajirobi/test/ie.jpg
Opera: http://home.arcor.de/yajirobi/test/o.jpg
NS6: http://home.arcor.de/yajirobi/test/ns6.jpg
Grüße aus Berlin
Christoph S.
Gruß aus Berlin zurück ;-)
Karsten S. aus B. an der S. *g*
tag,
nun hast du mich zwar angemailt, ich antworte trotzdem hier im Forum nochmal ...
Folgendes: Netscape und mozilla halten offenbar den Rand frei, der um eine Tabellenzelle liegen soll, und zwar in der Größe von je zwei Pixeln, egal, ob man padding und border mit "0" vorgibt (irgendwo hab ich dazu auch mal was gelesen, weiß jetzt bloß die Quelle nicht mehr. Du kannst den Browser beschummeln, indem du deine Hintergrundbilder in den Tabellenzellen mit CSS formatierst und einfach die Randbreiten auf negative Werte setzt. Deine Tabelle sieht dann, etwas eingedampft, im Prinzip so aus:
<table border="0" cellspacing="0" cellpadding="0" width="758">
<tr>
<td><img src="top_01.gif" width="212" height="129" alt=""></td>
<td><img src="top_02.gif" width="507" height="129" alt=""></td>
<td><img src="top_03.gif" width="39" height="129" alt=""></td>
</tr><tr>
<td style="background-image:url('mid_01.gif');" valign="top" align="left">
<img alt="" src="mid_top_01.gif" width="212" height="103" style="position: relative; top: -4px;">
<table border="0" cellpadding="0" cellspacing="0" width="160">
<tr>
<td width="25px"> </td>
<td class="menunormal"><a href="../index.html">Startseite</a></td>
</tr><tr>
<td style="height:25px"> </td>
<td class="menunormal"> </td>
</tr>
</table>
</td>
<td bgcolor="#FFA500" valign="top"><p align="center"><img src="unconst.gif" width="128" height="40" alt="Under Construction"></td>
<td style="background-image:url('mid_02.gif');" valign="top"><img alt="" border="0" src="mid_top_02.gif" width="39" height="103" style="position: relative; top: -4px;"></td>
</tr>
</table>
Du siehst, daß das Problem für die erste und dritte Spalte behoben ist, in der mittleren ist die Spalte noch da - aus Demonstrationsgründen.
Christoph S.