Grid列的响应宽度，但不超过且不小于

Question

我希望有一个带有卡片的css网格，这些卡片具有响应能力，并且可以增长和收缩，如下图所示：

因此，我使用了minmax css函数：

grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));

但是，如果列表中没有更多的卡片可放在单行中，则现有的卡片将增长到父卡片的极限：

如何给minmax函数设置上限？

Answer 1

用自动填充替换自动调整，它应该按照您想要的方式工作