Мне нужно сделать подходящую CSS для: создание ящиков, которые можно разбить на один или несколько столбцов, зависит от размера экрана.(например: если у меня есть 7 полей, оно может отображаться на большом экране в 7 столбцах и 1 строке или на меньшем экране в 2 рядах и 4 столбцах и т. д.
Теперь я делаю вконтейнер div:
display: flex;
flex-wrap: wrap;
overflow-y: auto;
overflow-x: hidden;
и в классе блока:
height: 166px;
width: 320px;
Я хочу, чтобы у меня был маленький экран и у меня было достаточно места только для одного столбца, например:если родительский элемент div имеет ширину 600 пикселей, у меня будет только один столбец блоков, но много дополнительного пространства, я хочу, чтобы в этом случае поля сжимались до ширины 250 пикселей (минимальная ширина) и чтобы у меня было 2 столбца..
Я хочу использовать flex-shrink только тогда, когда у меня есть один столбец, созданный из дисплея flex.
Как я могу это сделать (я хочу, чтобы он работал во всех браузерах,вот почему я не использовал сетку)
Спасибо