Ein dynamischer + fester Bereich autom. an Parent anpassen

[Mitleser]

Huhuh!

----------------------- Äußerer Container
-------------- Zelle 1
1
2
-------------- Zelle 2
a
b
c
d
.
.
--------------
--------------

Die erste Zelle "12" soll innerhalb eines Containers fest oben stehen, die zweite "abcd" direkt darunter und dynamisch wachsen und bei Bedarf(wenn Gesamthöhe des äußeren Containers nicht reicht) vertikale Scrollbars zeigen. So weit so einfach, wenn ich die beiden in ein Elternteil mit position:relative packe und der ersten Zeile top:0 sowie eine feste Höhe gebe und Zelle zwei dann analog top:"Höhe Zelle 1" und bottom:0 verpasse.

Was aber, wenn ich die Inhalte / Höhe von "Zelle eins" ebenfalls nicht kenne und trotzdem das gewünschte Verhalten erreichen möchte? Via JavaScript wäre es klar, die Frage zielt auf eine reine CSS-Lösung ab. Ich würde sogar ne Tabelle nehmen, falls das ein Lösungsweg sein könnte :-)

Danke!

[Gunnar Bittersmann]

@@Mitleser:

nuqneH

Was aber, wenn ich die Inhalte / Höhe von "Zelle eins" ebenfalls nicht kenne und trotzdem das gewünschte Verhalten erreichen möchte? Via JavaScript wäre es klar, die Frage zielt auf eine reine CSS-Lösung ab. Ich würde sogar ne Tabelle nehmen, falls das ein Lösungsweg sein könnte :-)

position: sticky in Browsern, die das schon unterstützen.

Qapla'

[Mitleser]

position: sticky in Browsern, die das schon unterstützen.

Danke. Ich vergaß zu erwähnen, dass eine für den Produktiveinsatz geeignete Lösung mit breiter Browserunterstützung gesucht wird ;-)

Ja, das Polyfill hab ich gesehen :-)

[Gunnar Bittersmann]

@@Mitleser:

nuqneH

Danke. Ich vergaß zu erwähnen, dass eine für den Produktiveinsatz geeignete Lösung mit breiter Browserunterstützung gesucht wird ;-)

Nur mal eine Überlegung: Wenn es schon eine andere CSS-Lösung gäbe, würde man wohl kaum position: sticky in CSS einführen.

Ja, das Polyfill hab ich gesehen :-)

Na dann ist ja gut.

Qapla'

[Mitleser]

Nur mal eine Überlegung: Wenn es schon eine andere CSS-Lösung gäbe, würde man wohl kaum position: sticky in CSS einführen.

ACK. Die Konstellation, hiermit eine unnötig komplexe Bastelei (wo isse?;-)) abzulösen, wäre aber auch nicht ausgeschlossen :-)