So dimensionieren Sie eine Flexbox basierend auf der Höhe eines Iframes [Duplikat] ⇐ HTML

[Guest]

Ich habe eine 3-Elemente-Flexbox. Eines seiner Elemente enthält einen Iframe. Ich möchte, dass die Höhe der Flexbox (Länge quer zur Achse) durch die Höhe der Iframe-Quelle bestimmt wird. Stattdessen wird die Höhe der Flexbox auf die maximale Höhe der anderen beiden Elemente eingestellt.
Hier ist eine Annäherung an meinen HTML-Code:

Code: Select all

...

A label

...


...

Hier ist eine Abkürzung des CSS. Die Elemente 1 und 3 sind ebenfalls Flexboxen.

Code: Select all

.elements {
display: flex;
flex-direction: row;
align-items: stretch;
}
.element-1 {
width: min-content;
flex: 0 0 auto;
}
.element-2 {
flex: 1 0 auto:
display: grid;
grid-template-rows: 1.1em 1fr;
}
.element-2 > iframe {
width: 100%;
align-self: stretch;
}
.element-3 {
flex: 0 0 auto;
}

Ich weiß, dass ich die Höhe des Iframes explizit auf einen absoluten Wert festlegen kann, aber in der Praxis werde ich den Inhalt des Iframes dynamisch ändern. Ich möchte, dass mein Browser die Quelle des Iframes liest, eine angemessene natürliche Höhe dafür ermittelt und diese bei der Berechnung der Höhe der Flexbox verwendet. Stattdessen wird der Inhalt in einem Scrollfenster angezeigt.
(Außerdem befindet sich das eingebettete Dokument nicht unbedingt auf demselben Host wie mein Dokument, daher kann ich es nicht immer mit JavaScript abfragen Abmessungen des eingebetteten Dokuments.)
BEARBEITEN: Meine Frage wurde geschlossen, weil in einer zuvor beantworteten Frage gesagt wurde, dass sie JavaScript verwenden sollte. Wie ich im letzten Absatz erwähnt habe, kann ich kein JavaScript verwenden. Vielleicht sollte ich fragen: Wie bestimmt ein Browser die Höhe eines Iframes, wenn er nicht explizit festgelegt wird?