Div height anpassen

[Picard]

Hallo, ich habe folgendes Problem:
Auf meiner Website habe ich oben und unten eine fest definierte Zeile von height:50px. Der Mittelteil ist variabel, also height:100%.
In den Mittelteil habe ich einen DIV integriert, dieser DIV soll automatisch so hoch wie der Mittelteil sein. Wenn ich in aber auf height:100% setze, verschiebt er die untere Zeile soweit wie er gerade groß sein muss, um seinen Inhalt zu fassen.
Eine height-Angabe in px schließt sich aus, da er Variabel zu jeweiligen Auflösung sein soll.
Schonmal im Vorraus danke.
MfG, Picard

[Florian Stascheck]

Hallo,
Das müsste sich realisieren lassen: mit top: 0 und bottom: 50px wird er automatisch positioniert!! (aso: position: absolute):

<div style="top: 0; bottom: 50px; position: absolute;"></div>

mfg, Flo

[Picard]

<div style=\"width:410px; height:100%; top: 50px; bottom:50px; position:absolute; overflow-x:hidden; overflow-y:scroll;\">
also so liefert der mir nen div der über die tabelle rausgeht
Trotzdem danke

[Steel]

Hi!

also so liefert der mir nen div der über die tabelle rausgeht

Öhm. Tabelle? Wo kommt die denn nun her? Eben waren es noch 3 Bereiche.

Zu Deinem Problem: Du hast oben 50px und unten 50 px.  Und in der Mitte einen variablen Bereich. Frage: Was bringt dich zu der Annahme dieser Bereich hat eine Höhe von 100%? 100% von was? Du wirst so immer einen Bereich haben der 100% der Höhe seines Elternelements hat. Das kann nicht Deine Absicht sein, denn selbst wenn das Elternelement die Höhe des Viewports hat, stehen darüber noch 50 Pixel und darunter auch. Du hast also unten noch 100 Pixel mehr als Viewport. Eine Höhe von 100% - 100px gibt es nicht. Der Ansatz scheint also falsch.

Du lieferst keinen Code, also kann Dir auch niemand sagen was Dein Problem ist. Da Glaskugeln heute alle elektrisch funktionieren und sich keiner mehr den Strom leisten kann, fällt diese Option leider weg.

Der Tipp von Florian ist aber nicht total falsch, denn top 50px und bottom 50px bei absoluter Positionierung könnte helfen.

Fraglich ist auch, ob diese Art des Layout überhaupt Sinn macht. Je nach Viewport könnte das Endergebnis für den User recht frustrierend sein. Nur mal so als Beispiel: Ein aktuelles (Oberklasse) Netbook hat z.B. überhaupt nur eine Auflösung von 1024 x 600 auf einem 10" Monitor. Und das ist nicht die kleinste verfügbare Anzeige. Nach oben hin könnte es auch komisch aussehen, wenn auf nem 24 Zöller im Vollbildmodus zwischen oberem und unterem 50px Element ausser 2 Sätzen, die sich in ein oder zwei Zeilen über die Breite verteilen zum größten Teil alles leer ist.

Nimm das als konstruktive Kritik zum Überdenken ob man dein Problem nicht durch eine Sinvolle Layoutänderung lösen könnte. Du hast ja nichts über dein Projekt gesagt.

[Picard]

Hier mal der Code, auf Anregung von Steel :)

<table border=\"0\" width=\"100%\" height=\"100%\" cellpadding=\"0\" cellspacing=\"0\">  
     <tr>  
         <td class=\"header\">  
         <img alt=\"Justin Behmel\" class=\"header_logo\" src=\"./media/images/design/header_logo.png\"/>  
         </td>  
          <td class=\"header\" colspan=\"2\" align=\"right\">\n");  
                </td>  
     </tr>  
     <tr>  
      <td class=\"content\" valign=\"top\" colspan=\"3\">  
      <div style=\"width:100%; height:100%; overflow:auto\">  
                </td>  
     </tr>  
     <tr valign=\"bottom\">  
      <td class=\"footer\" width=\"200\">  
      </td>  
      <td class=\"footer\" align=\"middle\">  
      <img alt=\"© Justin Behmel\" src=\"./media/images/design/footer_copyright.png\"/>  
      </td>  
      <td class=\"footer\" width=\"200\" align=\"right\">  
      <a class=\"static_link\" href=\"./index.php?content=admin\">Admin-Center</a>  
      </td>  
     </tr>  
 </table>

[suit]

Hier mal der Code, auf Anregung von Steel :)

und welche sprache ist das jetzt?