Flex-wrap не имеет никакого эффекта, вместо этого контейнер растет ⇐ CSS

[Anonymous]

У меня есть flex-wrap: Wrap, но элементы не переносятся, а вместо этого увеличивается контейнер. Я хочу, чтобы предметы заворачивались, а не контейнер становился выше. Вот пример:

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

1
2
3
4
5
6
7

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Вижу высокий контейнер без упаковки:


Но я хочу обертку вместо излишнее увеличение контейнера. Вот эскиз:


Высота контейнера должна определяться другими его дочерними элементами, а не дочерним элементом флексбокса, который по какой-то причине отказывается переноситься.
Высота флексбокса не должна быть каким-то произвольным жестко запрограммированным числом. Флексбокс должен использовать пространство, доступное в его контейнере, а затем переносить его. Высота контейнера должна определяться другими дочерними элементами этого контейнера.
Я ищу решение с помощью CSS, а не JavaScript.
Различные вещи из разных сообщений, такие как fit-content и высота: auto, не работали.

Подробнее здесь: https://stackoverflow.com/questions/793 ... ws-instead