Illuvatar: div in Tabellenzelle --> Höhe 100%

Hallo zusammen,

zuerst einmal: ich weiß, dass solche Fragen schon öfters gestellt wurden, ich habe im Archiv allerdings keine befriedigende Antwort gefunden. Mein Problem ist nämlich eine zweispaltige HTML-Tabelle (ja, die enthält tabellarische Daten ;)), bei der in einer Zeile die linke Zelle so aussehen soll:

Ganz oben ein Button, in der Mitte ein Stück Text, und ganz unten wieder ein Button. Die Zellenhöhe (abhängig von der rechten Spalte) kann variieren... ich habe ein div mit height:100% probiert, in dem wieder drei divs sind. Allerdings sind alle Inhalte jetzt immer in der Mitte zusammengequetscht.

Der Quelltext der besagten Zeile:

  
<tr><td style='background-color:#EFF5FA;padding:3px'>  
 <div style="width:100%;height:100%">  
 <div><input type="button" value="Hinzufügen" onClick="cp_createEntry();"/></div>  
 <div style="height:100%;vertical-align:center">Einträge:&nbsp;</div>  
 <div style="vertical-align:bottom"><input type="button" value="Hinzufügen" onClick="cp_createEntry();"/></div>  
 </div></td>  
<td id="ll_entries"><!--dynamischer Inhalt--></td></tr>  

  1. Hallo Illuvator,

    Ich weiß jetzt nicht ob die Lösung für dein Problem wirklich so banal ist, weil ich es nicht ausprobiert hab, aber wie soll das auch funktionieren, wenn du in einem 100% großen div-Tag noch mal drei div-Tags stecken, von denen eines auch 100% groß ist. Wie viel % sollen denn die anderen abbekommen? Das ist der erste Punkt. Der zweite ist: schonmal ausprobiert ne fixe Tabellenhöhe festzulegen? Kann ja sein, dass du das getan hast, nur kann ich das aus deinem quelltext nicht entnehmen.

    Hoffe konnte dir helfen, ansonsten versuchs einfach weiter ;)

    Sebi

    1. Hallo Illuvator,

      Ich weiß jetzt nicht ob die Lösung für dein Problem wirklich so banal ist, weil ich es nicht ausprobiert hab, aber wie soll das auch funktionieren, wenn du in einem 100% großen div-Tag noch mal drei div-Tags stecken, von denen eines auch 100% groß ist. Wie viel % sollen denn die anderen abbekommen? Das ist der erste Punkt. Der zweite ist: schonmal ausprobiert ne fixe Tabellenhöhe festzulegen? Kann ja sein, dass du das getan hast, nur kann ich das aus deinem quelltext nicht entnehmen.

      Hoffe konnte dir helfen, ansonsten versuchs einfach weiter ;)

      Sebi

      Naja, das Problem scheint ja eher zu sein, dass das äußere div, das die 3 anderen beinhaltet sich nicht ausdehnt (so scheint es jedenfalls in Opera - Ansicht - Seitendarstellung - Elemente kennzeichnen). Die 100% von dem mittleren sind nur, damit das allen verfügbaren Platz einnimmt, wenn ich die 3 divs auf 33/34/33 Prozent Höhe stelle, ändert sich jedenfalls auch nichts.
      Fixe Höhen sind bei mir leider insgesamt sehr schlecht, da die Höhe nicht feststeht und sich auch (DHTML) ändern kann.

  2. Ich habe es mit einem rowspan geschafft, das mittlere ist nicht in der Mitte, aber das ist nicht so wichtig.

    <tr><td style="background-color:#EFF5FA;vertical-align:top;height:5em;padding:3px"><input type="button" value="Hinzufügen" onClick="cp_createEntry();"/></td>  
    <td rowspan="3" id="ll_entries"><!--dynamischer Inhalt--></td></tr>  
    <tr><td style="background-color:#EFF5FA;vertical-align:middle;padding:3px">Einträge:&nbsp;</td></tr>  
    <tr><td style="background-color:#EFF5FA;vertical-align:bottom;padding:3px"><input type="button" value="Hinzufügen" onClick="cp_createEntry();"/></td></tr>