Manchmal soll eine einzelne Zelle sich über mehrere Spalten oder Zeilen erstrecken - zum Beispiel eine Überschrift, die über der gesamten Tabelle steht. Dafür gibt es zwei Attribute: colspan und rowspan.

colspan: mehrere Spalten verbinden

colspan="2" sorgt dafür, dass eine Zelle den Platz von zwei Spalten einnimmt (statt nur einer):

<table>
  <tr>
    <th colspan="2">Spieltag 1</th>
  </tr>
  <tr>
    <td>Heim</td>
    <td>Auswärts</td>
  </tr>
</table>

Wichtig: Weil die erste Zeile nur eine Zelle hat, die aber den Platz von zwei Spalten einnimmt, muss man in der zweiten Zeile keine Anpassung machen - colspan "verbraucht" die Spaltenplätze automatisch mit.

rowspan: mehrere Zeilen verbinden

rowspan="2" funktioniert genauso, nur senkrecht: die Zelle nimmt den Platz von zwei Zeilen ein:

<table>
  <tr>
    <th rowspan="2">Torwart</th>
    <td>Spieler B</td>
  </tr>
  <tr>
    <td>Ersatz: Spieler C</td>
  </tr>
</table>

Hier hat die erste Zeile zwei Zellen (eine davon mit rowspan="2"), die zweite Zeile aber nur eine einzige - weil die Torwart-Zelle bereits beide Zeilen abdeckt, braucht die zweite Zeile keine eigene Zelle mehr dafür.

Eine kleine Turniertabelle für Finn

Bauen wir eine kleine Tabelle mit dem nächsten Spieltag, bei dem eine Überschrift über zwei Spalten steht:

<h2>Nächstes Spiel</h2>
<table>
  <tr>
    <th colspan="2">Samstag, 15 Uhr</th>
  </tr>
  <tr>
    <td>Heim</td>
    <td>SV Musterstadt</td>
  </tr>
  <tr>
    <td>Auswärts</td>
    <td>FC Beispielheim</td>
  </tr>
</table>