css - 如何创建所有未知行数具有相同高度但不是最后一行的网格布局？

Question

我正在创建一个行数未知的表单，但最后一行应该是固定高度，其中包含表单操作按钮现在如何在网格系统中编写它。

这是主要的容器 CSS 属性

{
     display:grid;
     grid-template-area: 'body' 'button';
     grid-template-row: 1fr 80px 
     grid-auto-flow: row;
     grid-gap: 10px
 }

我知道 grid-template-row: 1fr 80px 会创建一行和下一行 80px；

我需要写这样的东西 repeat(x, 1fr), 80px

如何使用 CSS Grid Layout 实现这一目标 .

Answer 1

试试 grid-template-rows: repeat(auto-fill, 1fr) 80px;

这应该可以完成您想要完成的任务。