Свойство соотношения сторон не работает в горизонтальном флексбоксе, почему? ⇐ CSS

[Гость]

У меня есть очень простой макет флексбокса с текстом и элементом фонового изображения рядом с ним. Элемент фонового изображения справа должен автоматически сохранять ту же высоту, что и текстовый элемент, а также соотношение сторон 1/1, например:
Ожидаемое:

Но Свойство соотношения сторон игнорируется. Высота

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

#image

element is set to the height of the flexbox like I want it (since the flexbox by default sets

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

align-items: stretch

). But the width stays at 0, despite the aspect ratio property, which should set the width to the same as the height.
Interestingly, if the flexbox is set to

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

flex-direction: column

it does work as expected.
Why isn't aspect ratio correctly applied in a row flexbox and how do I fix it?

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

#wrapper {
display: flex;
}

#image {
background-image: linear-gradient(red, gray);
border: 1px solid black;
aspect-ratio: 1 / 1;
}

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

A headline
And some text below it

Element to the right should be a square

Источник: https://stackoverflow.com/questions/761 ... lexbox-why