在Firefox中使用CSS网格的粘性页脚失败

我正在玩CSS网格（目前还没有），我无法在Firefox中使用粘性页脚。它在Chrome中工作得很好，所以这可能是浏览器的问题，但我遵从社区的更多知识

我将主体设置为主要网格元素，并定义列/行，如下所示：

body {
    min-height: 100vh;
    display: grid;
    grid-template-rows: min-content min-content 1fr min-content;
    grid-template-columns: 1fr 15em;
    grid-template-areas: "masthead masthead"
                         "nav nav"
                         "main side"
                         "footer footer"
}

现在，我假设“网格模板行：min content min content 1fr min content”意味着第1、2和4行的大小取决于它们的内容，第3行将占用所有剩余空间，这就是它在Chrome中的工作方式，而不是Firefox

代码笔：

---

p、 我应该补充一点，在我的DOM浏览器中，body元素正确地显示为填充整个窗口的高度。

这可能是Firefox的错误，但我真的不知道。我会选择

auto

而不是

1fr

：

grid-template-rows: min-content min-content auto min-content;

---

您使用的Firefox版本是什么？52，哪一个是当前版本Auto有效。我看不出1fr不起作用的原因，但如果我只有一行，那么可能值得记住。谢谢