Es ist die elegantere Lösung und zudem (zugegeben) noch recht einfach. Was ich nur einmal "per Hand" machen müsste ist den aspect Ratio errechnen wie in Deinem Beisiel und dem ImG
style="--aspect-ratio: calc (4/3)" geben.
Recht einfach.
Nur muss ich mir noch anlesen wie das mir dem Custom properties funktioniert.
https://wiki.selfhtml.org/wiki/CSS/Custom_properties_(CSS-Variablen)
https://www.mediaevent.de/css/variable.html
Anmerkung:
:root {
--area: 0.4;
--a: calc(var(--area) * var( --aspect-ratio));
--x0: 1;
--x1: calc((var( --x0) + var( --a) / var( --x0)) / 2);
--x2: calc((var( --x1) + var( --a) / var( --x1)) / 2);
--x3: calc((var( --x2) + var( --a) / var( --x2)) / 2);
width: calc(var( --x3) * 100%);
}
Das wäre es doch eigentlich und halt die Angaben --aspect-ratio: foo im style.
Nicht das ich wüßte, dann ist alles gut!
Gruß T.