Как я могу изменить поведение столбца/строки в зависимости от доступного пространства? ⇐ CSS

[Anonymous]

У меня есть набор карточек, у которых есть свои карточки, вот так (кстати, я использую TailwindCSS):

< div class="snippet-code">

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

Content 1
Content 2
Content 3


Content 4
Content 5

Конечный результат будет примерно таким, и это нормально:
изображение, показывающее результат рендеринга карточек
Но в зависимости от размера экрана я могу получить такой результат:
изображение, показывающее визуализированный результат карточек с пробелом на второй карте
Итак, я хочу, чтобы при наличии свободного места «мини-карточки» действовали как строки, а не как строки столбцы, например:
изображение, показывающее результат визуализации карточек без пробела на второй карточке
Есть ли способ добиться этого с CSS?

Подробнее здесь: https://stackoverflow.com/questions/786 ... able-space