Ulrich Leipold: tr/td Hintergrund

Guten Morgen, liebe Forumsgemeinde!

*erstmal von der Kanzel runterkomm*
Ich habe gestern allerhand herumprobiert, bin kein Stück weitergekommen und habe heute morgen auch nichts so recht passendes im Forum gefunden. Mein Problem:

Unter http://www.leipold-net.de/images/selfHTML/tr_td_test.html habe ich eine Testdatei abgelegt.

Aufgrund der css-Angaben hätte ich erwartet, daß um die Tabellenzellen herum noch zwei Pixel breit die Tabellenzeile zu sehen ist, mit den eingestellten Hintergrundfarben, aber genau das ist nicht der Fall. Stattdessen sehe ich direkt die Tabellenzellen, ohne die Zeile (die kräftigen Farben bitte ich zu entschuldigen... dient ja nur zum Testen, beim echten Einsatz würde es etwas dezenter gestaltet).

Da sich das wohl etwas konfus anhört ;) habe ich auch noch eine kleine Grafik gebastelt, die verdeutlicht, was ich meine: http://www.leipold-net.de/images/selfHTML/tr_td_test.png (sind nur 3.726 Bytes)

Irgendwie stehe ich da total auf dem Schlauch... hat irgendeiner eine Idee? Brauche ich Urlaub oder reicht Kaffee? Geht das überhaupt so, wie ich mir das dachte (siehe Grafik) oder habe ich diesen Teil CSS grundsätzlich mißverstanden?!?

Fragen über Fragen... freue mich auf Antworten.
Dank Euch im Voraus!
Ulli

  1. Hi,

    Unter http://www.leipold-net.de/images/selfHTML/tr_td_test.html habe ich eine Testdatei abgelegt.

    Aufgrund der css-Angaben hätte ich erwartet, daß um die Tabellenzellen herum noch zwei Pixel breit die Tabellenzeile zu sehen ist, mit den eingestellten Hintergrundfarben, aber genau das ist nicht der Fall. Stattdessen sehe ich direkt die Tabellenzellen, ohne die Zeile .

    Probiere mal border-spacing und/oder border-collapse für die Tabelle.

    margin hat bei tr und bei td übrigens keinen Sinn - tabelleninterne Elemente haben keinen margin.
    http://www.w3.org/TR/REC-CSS2/tables.html#q7

    cu,
    Andreas

    --
    MudGuard? Siehe http://www.mud-guard.de/
    1. Hallo Andreas!

      Probiere mal border-spacing und/oder border-collapse für die Tabelle.

      Habe ich schon reichlich und ausgiebig. Leider funktionierte alles exakt so, wie in selfHTML beschrieben, und nicht wie gewünscht :-D

      margin hat bei tr und bei td übrigens keinen Sinn - tabelleninterne Elemente haben keinen margin.
      http://www.w3.org/TR/REC-CSS2/tables.html#q7

      Hmmm. Schade eigentlich, finde meinen Gedankengang eigentlich logisch (oder denke ich da nur irgendwie komisch?). Aber ok, muß ich mir halt eine andere optische Trennung einfallen lassen (gibts halt kräftige Zellenränder oben und unten...).

      Ich danke Dir für Deine Hilfe,
      Ulli

  2. Da sich das wohl etwas konfus anhört ;) habe ich auch noch eine kleine Grafik gebastelt, die verdeutlicht, was ich meine: http://www.leipold-net.de/images/selfHTML/tr_td_test.png (sind nur 3.726 Bytes)

    Salut
    Gut aufbereitete Fragestellung! Macht Freude, diese Klarheit.

    Dein gewünschtes Aussehen kannst du meiner Meinung nach nur über einen Umweg mit CSS realisieren. Dieser wäre:

    -Der Tabelle Grau als Hintergrund geben und Border drum herum
    (Graue Border ums Ganze rum)
    -Dem <TR> die hell Gelb-Graue Farbe als Hintergrund
    (Farbe des No Class Bereiches)
    -Dem <TD> den roten Border geben. halt nur oben und unten, je nach Bedarf. Weiter text-align:middle; und vertical-align:middle
    (Erzeugt die rote Linie)
    -In den <TD> rein ein <span> mit Border Blau mit gewissem Abstand zur  Zellwand.
    (Erzeugt blaue Linie, sowie die bg1-3)

    Gruss
    Schorsch