Größenberechnung

[Constantin]

Hallo,

ich versuche in HTML ein Fenster zu programmieren, dabei bin ich wie folgt vorgegangen:

1. <div> mit fester Breite und Höhe
2. in diesem <div> sind drei Tabellen, die, da sie mit width:100%
   eingestellt wurden untereinander dargestellt werden.
3. Die obere und die untere Tabelle haben eine feste Höhe,
   und die mittlere wurde mit height:100% dazu gebracht, das
   Fenster auf die volle Größe des <div> "aufzuspannen".

Mein Problem ist jetzt, dass die angezeigten 3 Tabellen über den unteren Rand des <div> hinausragen (um genau die Höhe der oberen und der unteren Tabelle, da diese bei der Berechnung von 100% Höhe nicht abgezogen werden)

Ich zermarter mir mein Hirn und finde keine Lösung... oder ist der ganze beschriebene Ansatz schon falsch???

Constantin

[Steel]

Hi!

Ich versteh dich nicht...

Du hast ein Div mit fester Hoehe.
Du hast 3 Tabellen die du darin darstellen moechtest.
Tabelle 1 und 3 haben auch feste Hoehen und Tabelle 2 soll den Rest einnehmen...

Also nach meinem logischen Verstaendnis hat Tabelle 2 dann auch eine feste Hoehe. Und zwar ziemlich genau Divhoehe - Tabelle1hoehe - Tabelle3hoehe.

Wenn Tabelle 2 im Div liegt und du sagst dass sie so gross sein soll, wie ihr Elternelement (100%), dann sind die Tabellen logischerweise hoeher als das Div eigentlich ist. Und zwar 100% des Divs plus Tabelle 1 und Tabelle 3.

Falls das jetzt falsch war, erlaeutere dich bitte mal genauer, was Du eigentlich willst.

[Constantin]

Hallo, danke für deine Antwort!

Also, es ist so dass alle 3 Tabellen in dem DIV sind. Aber die Höhe der mittleren Tabelle wird leider nicht "Divhoehe - Tabelle1hoehe - Tabelle3hoehe" sondern eben Divhoehe.

Hast du dazu eine Idee?

[Constantin]

Nachtrag:

ich habe meinen Code jetzt auch im IE zum laufen gekriegt:
zur Übersicht:

• im Firefox:
    das umschließende DIV hat die fest vorgegebene Höhe und
    die Tabellen eine Größe tab1Höhe + divHöhe + tab3Höhe
• im IE:
    das umschließende DIV wird automatisch erweitert, sodass
    die Tabellen und das umschließende Div die Höhe
    tab1Höhe + (vorgegebene)divHöhe + tab3Höhe
    haben

Wie ´kann man soetwas unter einen Hut bringen?

[Steel]

aehm...

also versteh ich dich richtig? Die mittlere Tabelle SOLL Divhoehe haben? *skeptisch schau*

Mir entgeht immer noch der Sinn des ganzen.

[Constantin]

aehm...

also versteh ich dich richtig? Die mittlere Tabelle SOLL Divhoehe haben? *skeptisch schau*

Mir entgeht immer noch der Sinn des ganzen.

Hallo Steel!
Die mittlere Tabelle soll DivHöhe - Tabelle1Höhe - Tabelle2Höhe haben. Wenn man dann nämlich das umschliessende Div vergrößert/verkleinert, dann vergrößert sich die mittlere Tabelle automatisch...

Harlequin hat darauf gemeint, dass dies mit aktueller CSS-Technik nicht möglich ist... mist, da muss ich mir wohl was anderes überlegen!

Gruß!

[Harlequin]

Yerf!

Mein Problem ist jetzt, dass die angezeigten 3 Tabellen über den unteren Rand des <div> hinausragen (um genau die Höhe der oberen und der unteren Tabelle, da diese bei der Berechnung von 100% Höhe nicht abgezogen werden)

Ich zermarter mir mein Hirn und finde keine Lösung... oder ist der ganze beschriebene Ansatz schon falsch???

Das Problem ist, dass die Erfinder von CSS (zumindest bis jetzt) diesen Ansatz nicht wirklich berücksichtigen... Berechnendes CSS solle evtl. kommen (also wirklich ein 100% - Höhe A - Höhe B)

Es ist halt so, dass sich ein height 100% auf das umgebende Element bezieht, ohne Berücksichtigung anderer Elemente die sich darin befinden.

Eine Lösung wäre evtl. über absolute Positionierung möglich, wenn man der mittleren Tabelle Top und Bottom zuweist (wobei das umgebende Div dabei nicht static positioniert sein darf). Allerdings kann das der IE 6 nicht (beim 7er weiß ichs nicht...)

Gruß,

Harlequin

[imho_tep]

1. <div> mit fester Breite und Höhe
2. in diesem <div> sind drei Tabellen, die, da sie mit width:100%
      eingestellt wurden untereinander dargestellt werden.
3. Die obere und die untere Tabelle haben eine feste Höhe,
      und die mittlere wurde mit height:100% dazu gebracht, das
      Fenster auf die volle Größe des <div> "aufzuspannen".

Hallo Constantin,

im IE7 und FF2 könnte es so gehen:

• pack die 3 Tabellen in eine übergeordnete Tabelle mit height 100%.
• Tabelle 1 und 3 bekommen feste Höhe zugewiesen, Tabelle 2 keine.

Best wishes, imho_tep