Rahmen um mehrere tr's

[lord_fritte]

Hallo, ich habe ein kleines Problem: Ich habe eine Tabelle mit mehreren Spalten und Zeilen.
Der Aufbau sieht ca so aus:

<tr><td colspan='2'><br /></td></tr>
<tr><td>Titel 1</td><td>Inhalt 1</td></tr>
<tr><td>Titel 2</td><td>Inhalt 2</td></tr>
<tr><td>Titel 3</td><td>Inhalt 3</td></tr>
<tr><td colspan='2'><br /></td></tr>
...

Um die 3 Zeilen(Titel/Inhalt 1-3) möchte einen Rahmen mit eigener Hintergrundfarbe.
Ich habe versucht die 3 Zeilen in jeweils eine eigene Tabelle einzuschließen, aber dann sind die Spalten nicht mehr zu einander ausgerichtet.

 

[Mark]

Doch, sind sie, du musst nur die Untertabelle innerhalb der Haupttabelle anlegen.
Und wenn nur die 3 Zeilen insgesamt, nicht aber alle Zeilen oder die Zellen einen Rahmen haben sollen, machst du die Zeilen nochmal in eine Unter-Untertabelle.

<table>
<tr><td><br /></td></tr>
<tr><td>
<table border="1">
<tr><td>
<table>
<tr><td>Titel 1</td><td>Inhalt 1</td></tr>
<tr><td>Titel 2</td><td>Inhalt 2</td></tr>
<tr><td>Titel 3</td><td>Inhalt 3</td></tr>
</table>
</td></tr>
</table>
</td></tr>
<tr><td><br /></td></tr>
</table>

 

[lord_fritte]

Klar die Spalten innerhalb einer Tabelle sind gleich, aber schon ab der nächsten Tabelle, darunter, sind die Spalte, relativ, zur anderen Tabelle, verschoben.

 

[bodil]

hast du mal versucht, die Zeilen in einen tbody zu legen und den zu formatieren?

  <tr><td colspan='2'><br /></td></tr>
  <tbody class="borderAndBackground">
     <tr><td>Titel 1</td><td>Inhalt 1</td></tr>
     <tr><td>Titel 2</td><td>Inhalt 2</td></tr>
     <tr><td>Titel 3</td><td>Inhalt 3</td></tr>
  </tbody>
  <tr><td colspan='2'><br /></td></tr>

Wenn das klappt, wäre das der elegantere Weg. Und Tabellen, die in der ersten Zeile einen colspan benutzen, bitte unbedingt mal in älteren IEs testen ...

 

[lord_fritte]

habe ich auch schon versucht, dann habe ich einen Rahmen um jedes td innerhalb des tbody's

 

[threadi]

Sind es wirklich tabellarische Daten? Könntest Du nicht auch eine <ul>-Liste verwenden?

 

[bodil]

Schade. TBODYs verhalten sich da eher wie TRs. Das mit dem Border konnte ich gerade nicht nachvollziehen, nur die Hintergrundfarbe ist zu sehen. Trotzdem nochmal ne andere Idee. Mit diesem css (css3!) sollte es auch mit (meinem) obigen HTML funktionieren:

<style>
    tbody.borderAndBackground td {
        background-color:peachpuff;
    }
    tbody.borderAndBackground tr:first-child td {
        border-top: 1px solid cornflowerblue;
    }
    tbody.borderAndBackground tr:last-child td {
        border-bottom: 1px solid cornflowerblue;
    }
    tbody.borderAndBackground tr td:first-child {
        border-left: 1px solid cornflowerblue;    
    }
    tbody.borderAndBackground tr td:last-child {
        border-right: 1px solid cornflowerblue;
    }
</style>

 

[Mark]

<table cellspacing="0">
<tr><td style="border-style:solid; border-width: 2px 0px 2px 2px; border-collapse: collapse;">Titel 1</td><td style="border-style:solid; border-width: 2px 2px 2px 0px">Inhalt 1</td></tr>
<tr><td style="border-style:solid; border-width: 2px 0px 2px 2px; border-collapse: collapse;">Titel 2</td><td style="border-style:solid; border-width: 2px 2px 2px 0px">Inhalt 2</td></tr>
<tr><td style="border-style:solid; border-width: 2px 0px 2px 2px; border-collapse: collapse;">Titel 3</td><td style="border-style:solid; border-width: 2px 2px 2px 0px">Inhalt 3</td></tr>
</table>

Mit einem Stylesheet wäre es natürlich übersichtlicher.

 

[bodil]

Ich habe Lord Fritte so verstanden, dass er KEINE Linien zwischen den Zeilen wollte. Da finde ich das hier
http://www.html.de/html-und-xhtml/45778-rahmen-um-mehrere-trs.html#post323313 besser. (Ok, ist von mir ...)