Tabelle mit <colgroup>

[MonkeyMan]

Hallo,

ich hab folgendes Problem.

Ich hab eine Tabelle mit einer colgroup, die die breiten für die einzelnen <td>`s bestimmt. Tabelle:

<table id="list" class="list" border="1" width="100%">
<colgroup>
  <col width="20">
  <col width="150">
  <col width="*">
</colgroup>

Für die beiden hinteren Spalten ist es jetzt möglich, das beide benötigt werden oder eben nur eine:

<table id="list" class="list" border="1" width="100%">
<colgroup>
  <col width="20">
  <col width="150">
  <col width="*">
</colgroup>

  <tr>
    <td>Inhalt</td>
    <td>Inhalt 150er</td>
    <td>Inhalt *</td>
  </tr>
  <tr>
    <td>Inhalt</td>
    <td colspan="2">Inhalt 150er + Inhalt *</td>
  </tr>

</table>

Diese Tabelle läuft wunderbar, alles so wie es soll.

Aber wenn ich nur <tr>`s mit zwei <td> und colspan habe sprengt er die gegebenen Größen.. also so:

<table id="list" class="list" border="1" width="100%">
<colgroup>
  <col width="20">
  <col width="150">
  <col width="*">
</colgroup>

  <tr>
    <td>Inhalt</td>
    <td colspan="2">Inhalt 150er + Inhalt *</td>
  </tr>
  <tr>
    <td>Inhalt</td>
    <td colspan="2">Inhalt 150er + Inhalt *</td>
  </tr>

</table>

Hier verteilt er die Breiten der Spalten auf die gesamte Größe und ignoriert irgendwie die colgroup-Werte.

Meine Idee wäre gewesen einfach noch einen <tr> einzufügen in dem ich dann eben drei <td>`s à la "<td>gesch. Leerezeichen</td>" habe. Dann würde es wieder passen.

Geht aber nicht, da, die Tabellezellen nen Rahmen haben (ja der wird gebraucht) und man diese Krücke dann sieht.......tja, und was anderes weiß ich halt nicht.

Danke im Vorraus für die Hife !

 

[stephsto]

Hi,

wenn du diese Krücke per style als unsichtbar definierst dann sieht man diese nicht. Der einzig eKacken besteht darin, dass am oberen Ende der Tabelle ein kleiner Rand "übersteht". Schaus dir einfach an:

<table id="list" class="list" border="1" width="100%">
<colgroup>
<col width="20">
<col width="150">
<col width="*">
</colgroup>
<tr style="visibility:hidden;" ><td></td><td></td><td></td></tr>
<tr>
<td>Inhalt</td>
<td colspan="2">Inhalt 150er + Inhalt *</td>
</tr>
<tr>
<td>Inhalt</td>
<td colspan="2">Inhalt 150er + Inhalt *</td>
</tr>

</table>