nicht angemeldet
Unerwünschtes padding bei Tabellenzellen
Hallo, zusammen.
Seit geraumer Zeit plagt mich ein Problem, welche ich zwar detailliert untersucht habe, wodurch mir das Ausmaß bekannt ist, aber eine Lösung wurde mir dennoch nicht zuteil.
Es geht grob gesagt um CSS-formatierte Tabellen, welche Grafiken enthalten. Trotz padding:0 zeigt Opera einen mit der Rahmenbreite steigenden rechten Innenabstand an und Mozilla einen konstanten unteren Innenabstand. Dadurch ist die Hintergrundfarbe der Zelle sichtbar, obwohl die Grafik die Zelle ausfüllen sollte. Ein Beispiel.
<table style="border:0px solid #ff0000; border-collapse:collapse; border-spacing:0; margin:auto;">
<tr>
<td style="background-color:#00ff00; padding:0; border:30px solid #0000ff;"><img src="blank.png" alt="" width="700" height="60" /></td>
</tr>
</table>
Detaillierte Untersuchungen habe ich unter http://reich-gym.de/xtemplate-neu.html zusammengetragen. Das Problem lässt sich auch live bestaunen unter http://reich-gym.de/.
Mir ist, afair, aufgefallen, dass oben genannte Probleme im Opera 6.01 nur auftauchen, wenn ich dem Dokument eine XHTML 1.0 Strict-DTD voranstelle. Mir war nicht klar, ob Opera zwischen einem Konformitätsmodus und einem Kompatibilitätsmodus im Seitenrendering unterscheidet. Ich habe auch erst einmal ausgeschlossen, dass es ein legitimes Feature des Box-Modells ist.
Ein weiteres Problem ist die Darstellung von Tabellenzellenrahmen, welche den Tabellenrahmen überlappen. Dazu sind auf der oben angegebenen Seite ebenfalls Tests zu finden. Da jeder Browser unterschiedliche Auffassungen über die adäquate Visualisierung hat (siehe Grafiken), frage ich mich, woran ich mich halten muss, denn imho ist die Anzeige des Internet Explorers in diesem Fall am naheliegendsten.
Weiterhin gibt es ein Problem beim Opera, und zwar bei einer Tabellenzelle, welche zwei waagerechte Zellen umschließt (colspan="2"): Der Rahmen rechts wird nicht vollständig angezeigt (siehe vor allem beim Fuß des Layouttabelle, neben dem XHTML-Button).
Unter Umständen kennt jemand Ursachen oder Lösungen, so wäre ich demjenigen sehr verbunden, falls er diese notieren könnte, obgleich ich plane, das Tabellenlayout durch ein CSS-Layout zu ersetzen.
Grüße,
Mathias
-
hi
Es geht grob gesagt um CSS-formatierte Tabellen, welche Grafiken enthalten. Trotz padding:0 zeigt Opera einen mit der Rahmenbreite steigenden rechten Innenabstand an und Mozilla einen konstanten unteren Innenabstand. Dadurch ist die Hintergrundfarbe der Zelle sichtbar, obwohl die Grafik die Zelle ausfüllen sollte. Ein Beispiel.
Das in Mozilla gehört so. Mit 'nem vertical-align:bottom für's Bild isses wech.
Mir ist, afair, aufgefallen, dass oben genannte Probleme im Opera 6.01 nur auftauchen, wenn ich dem Dokument eine XHTML 1.0 Strict-DTD voranstelle. Mir war nicht klar, ob Opera zwischen einem Konformitätsmodus und einem Kompatibilitätsmodus im Seitenrendering unterscheidet. Ich habe auch erst einmal ausgeschlossen, dass es ein legitimes Feature des Box-Modells ist.
seltsam - ansich betont man bei Opera doch so gerne, dass man keine DOCTYPE-Unterscheidung hat - hm
Ein weiteres Problem ist die Darstellung von Tabellenzellenrahmen, welche den Tabellenrahmen überlappen. Dazu sind auf der oben angegebenen Seite ebenfalls Tests zu finden. Da jeder Browser unterschiedliche Auffassungen über die adäquate Visualisierung hat (siehe Grafiken), frage ich mich, woran ich mich halten muss, denn imho ist die Anzeige des Internet Explorers in diesem Fall am naheliegendsten.
es sind unabhängige rahmen, die alle sichtbar sein müssen. Nur bei angabe von border-collapse:collapse werden diese zusammengelegt.
Grüße aus Bleckede
Kai
-
Hallo.
Es geht grob gesagt um CSS-formatierte Tabellen, welche Grafiken enthalten. Trotz padding:0 zeigt Opera einen mit der Rahmenbreite steigenden rechten Innenabstand an und Mozilla einen konstanten unteren Innenabstand. Dadurch ist die Hintergrundfarbe der Zelle sichtbar, obwohl die Grafik die Zelle ausfüllen sollte. Ein Beispiel.
Das in Mozilla gehört so. Mit 'nem vertical-align:bottom für's Bild isses wech.
Danke, nun funktioniert es.
Ein weiteres Problem ist die Darstellung von Tabellenzellenrahmen, welche den Tabellenrahmen überlappen. Dazu sind auf der oben angegebenen Seite ebenfalls Tests zu finden. Da jeder Browser unterschiedliche Auffassungen über die adäquate Visualisierung hat (siehe Grafiken), frage ich mich, woran ich mich halten muss, denn imho ist die Anzeige des Internet Explorers in diesem Fall am naheliegendsten.
es sind unabhängige rahmen, die alle sichtbar sein müssen. Nur bei angabe von border-collapse:collapse werden diese zusammengelegt.
Wie meinst du das - dass es richtig ist, dass sie zusammengelegt werden bei border-collapse:collapse?
Doch es geht hier nicht um *eine* Tabelle. Wenn ich bei einer freistehenden Tabelle border-collapse:collapse setze, ist es richtig, dass sich Tabellenrahmen (<table style="border:...") gegenseitig und zusammen den Zellenrahmen (<td style="border:...") überlappen.
Aber mir geht es um eine Tabelle in einer Tabelle. Das Problem ist, dass die Zellenrahmen der inneren Tabelle nicht nur den eigenen Tabellenrahmen überlappen - das wäre logisch und richtig bei border-collapse:collapse, so will ich es auch -, sondern auch den Zellenrahmen der äußeren Tabelle, wenn padding der äußeren Tabelle 0 sein soll (bspw. blinde Layouttabelle). Alleine beim Tabellenrahmen der äußeren Tabelle macht die Überlappung halt, aber das hängt von der Breite ab.
Ich werde das Problem wohl umgehen müssen, bspw. in ich die Struktur so ändere, dass das padding größer als Null sein kann.Grüße,
Mathias
-