Css 网格显示列的宽度不相等

与

在窄小的屏幕中，这两列的宽度不同。我不明白。

---

谢谢您的帮助。

在理想情况下，两个单元格的大小相同

但每个细胞都有一个最小尺寸！它被定义为最小内容宽度。例如：较大的单词、较大的按钮或其包含的较大图像

为了避免这种情况，应该对每个列定义使用minmax0，1fr。它允许你说1fr，一个分数，是列的最大宽度

总之，请使用以下代码：

.电网{ 显示：网格； 网格模板列：minmax0，1fr minmax0，1fr； } 这里是问题和解决方案的现场演示。 .电网{ 显示：网格； 网格模板柱：1fr 1fr； } .网格修复{ 网格模板列：minmax0，1fr minmax0，1fr； } /*演示样式*/ .电网{ 栅隙：20px； 最大宽度：400px； } .细胞{ 背景：火红； 文本对齐：居中； 填充：1em； } 完全相同的细胞

第1单元 第2单元 单元格调整大小以容纳内容

第1单元 第二单元是Biiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiig 此行为可使用minmax0、1fr禁用

第1单元 第二单元是Biiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiig

---

请发布足够的代码来重现这个问题。越多越好，但我没有否决这个问题。这是CSS网格的一个典型问题，因此我们可以很容易地提供帮助。当问题中的信息太少时，这么早回答还为时过早。你最多只能猜测OP的问题是什么。同样地在OP给出最低预期信息/问题质量之前提供答案会将错误的单曲发送给他们和其他观点，认为可以或鼓励他们提出此类部分形成的问题，而不是提供一份清晰的问题陈述以及一份MCVE，用于不按预期/理解工作的代码。我理解您的建议立场，但我不同意评估问题。我发现并发现它足以理解这个问题。这里没有猜测。谢谢你，它非常有用。最后我发现我忘记了一个右边距规则，它是从基本CSS继承的。不管你的回答如何好，我接受这个解决方案。

grid-template-columns:1fr 1fr;