Machen Sie das erste Kind des nächsten Geschwisters, die die verbleibende Bildschirmhöhe ausfüllen ⇐ HTML

[Anonymous]

Hier gibt es viele Beispiele zum Stapelüberlauf und im Internet, in denen erklärt wird, wie ein Geschwisterelement den verbleibenden vertikalen Bildschirmraum mit Flexbox füllen kann. Zum Beispiel arbeiten diese hochrangigen Q & a.

Code: Select all

Some small height.


Fills the rest of the vertical screen space.

Jetzt ist mein Problem mit all diesen Lösungen, dass ich nicht möchte, dass ein Geschwisterelement den verbleibenden vertikalen Bildschirmraum aufnimmt, sondern das erste Child dieses Geschwisters. Dies ist die Seitenstruktur: < /p>

Code: Select all

Some small height.



Fills the rest of the vertical screen space *exactly*.


Lots and lots of content that gets pushed below
the bottom of the screen,
but can be scrolled up.
It's important that the whole page – including
the header – can be scrolled normally! So no
fixed header (or footer).
This section retains it's height when the page
is scrolled!!!



Common footer information.

Here is an image of what the layout would look like:


How can I achieve that? (Oder gibt es ein Duplikat, das ich nicht gefunden habe?)
Ich würde eine Flexbox -Lösung bevorzugen.