Dynamischer Inhalt schiebt Zelle in nicht sichtbaren Bereich

[HS]

Hallo,

ich habe ein etwas kniffliges Problem mit einer Tabelle, einem DIV und einer Zelle die in den nicht sichtbaren Bereich rutschen.

Ich habe eine Tabelle mit drei Zeilen und einer Spalte. In der obersten Zelle steht die Überschrift, darunter kommt eine Zelle mit einem div, in dem dynmaisch per JavaScript ein Baum gerendert wird. Es sind zwei divs die hintereinander liegen und entweder wird Baum 1 oder Baum 2 angezeigt. Um zwischen den beiden Bäumen hin und her schalten zu können gibt es die dritte Zelle. Und da sind wir am Problem.

Gewünschtes Verhalten: Die erste und die letzte Zelle sind immer sichtbar. Das div bekommt so viel Platz wie verfügbar ist. Reicht der Platz nicht für die Anzeige des Baumes aus, so sollen Scrollbars erscheinen.
1. Fehlverhalten: Der Baum passt komplett in das div und ich erweitere ihn solange bis des div zu klein ist, dann sollen die Scrollbars kommen. Es wird stattdessen die untere Zelle in den nicht sichtbare Bereich nach unten geschoben.
2. Fehlverhalten: Beim Laden der Seite reicht der Platz für den Baum nicht aus. Auch hier wird die untere Zelle in den nicht sichtbare Bereich geschoben.
Ich hab inzwischen auch versucht die divs in eine Tabelle innerhalb der Tabelle zu packen, aber auch dann verschwindet die untere Zelle.

Ich gebe den Aufbau mal kurz in "Pseudocode" an. Auf Wunsch kann ich auch den gesamten Code posten, aber das würde etwas dauern. :-)

<table height=100%>
  <tr height=32px>
    <td>Überschrift</td>
  </tr>
  <tr height=100%>
    <td><div height=100%>Dynamisch erstellter Baum</div>
        <div height=100%>Dynamisch erstellter Baum 2</div></td>
  </tr>
  <tr height="32px">
    <td><div>Link um zwischen zwei Bäumen zu wechseln</div></td>
  </tr>
</table>

Ich hoffe ihr könnt mir auf die Sprünge helfen.

Gruß und Danke, HS