/ / Gibt es eine div height-Größe für ein Bild in einem Container, kann flexbox automatisch eine zweite div-Höhe berechnen, um den Container zu füllen? - html, css, css3, flexbox, ber

Wenn eine div height an ein Bild in einem Container angepasst wird, kann flexbox automatisch eine zweite div-Höhe berechnen, um den Container zu füllen? - html, css, css3, flexbox, ber

Ich hoffe, dass ich flexbox verwenden kann, um ein Div-Stacking-Problem zu lösen.

Ich habe einen Container div. Seine Höhe ist 100vh.

In diesem Div habe ich zwei Divs.

Eins, enthält ein Bild. Seine Höhe hängt von der Größe des Bildes ab, das proportional zur Browserbreite bis zu einem wächst max-width.

Ein zweites div befindet sich oben auf dem ersten div. Ich will es height gleich der verbleibenden Höhe des div.

Kann flexbox das für mich automatisch berechnen? Hoffe so.

Antworten:

1 für die Antwort № 1

Die Antwort ist ja. Versuchen Sie zu appying flex: 1 zum zweiten div. Das bedeutet, dass es sich dehnen muss, um den verbleibenden Platz im Container zu füllen.

Hier ist eine Illustration der Wirkung: DEMO