CSS: максимизировать div и сохранить аспект ⇐ CSS

[Anonymous]

Я хочу, чтобы мой холст был максимально большим, но сохранил соотношение сторон. Он должен работать, если экран становится менее широким, а также когда его высота уменьшается. Никогда не позволяйте этому переполнять. Не могли бы вы мне помочь?

Код: Выделить всё

#screen {
margin: 2em;
/* Available space after margins */
width: calc(100vw - 4em);
height: calc(100vh - 4em);
}
/* Stay small, not absolutely needed*/
.constrain-container {
display: flex;
height: 100%;
}

.constrain-height {
display: flex;
min-width: 0;
width: auto;
height: 100%;
aspect-ratio: 320/200;
margin: auto;
}

.constrain-width {
display: flex;
min-width: 0;
width: 100%;
height: auto;
aspect-ratio: 320/200;
margin: auto;
}

canvas {
width: 100%;
height: 100%;
border: 1px solid red;
}< /code>










Move this this up

Подробнее здесь: https://stackoverflow.com/questions/797 ... pect-ratio