为什么min-content不能使用自动填充或自动填充？

Question

基本上,我不明白为什么这样做:

.grid {
  display: grid;
  grid-template-columns: repeat(4, min-content);
}

但这不起作用:

.grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, min-content);
}

我真的希望使后一种功能成为可能.还有其他方法可以使它工作吗？

Answer 1

第二个规则不起作用，因为它min-content是一个固有的大小调整函数。

§7.2.2.1。的语法 repeat()

• 自动重复（auto-fill或auto-fit）不能与固有尺寸或灵活尺寸结合使用。

§11.网格大小

• 一个内在宽度功能（min-content，max-content，auto， fit-content()）。

• 灵活的尺寸调整功能[ 是fr单位的尺寸 ]。