我需要针对以下情况做适当的CSS：创建一个可以根据屏幕尺寸分为一列或多列的盒子。 （例如：如果我有7个框，它可以在7列1行的大屏幕上显示，也可以在2列4列的小屏幕上显示，等等。
现在我正在div容器中进行操作：
display: flex;
flex-wrap: wrap;
overflow-y: auto;
overflow-x: hidden;
并在框类中：
height: 166px;
width: 320px;
我希望如果我的屏幕很小，并且我有足够的空间仅容纳一列，例如：如果div父级具有600 px的宽度，那么我将只有一列框，但是有很多额外的空间，我希望在这种情况下，框会缩小到250px（最小宽度），我要有2列。
仅当我有一个从显示flex创建的列时，我才想使用flex-shrink。
我该怎么办？ （我希望它在所有浏览器中都能正常工作，这就是为什么我不使用网格的原因）
谢谢