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 网格布局来实现这一点 。

标签： cssgrid

Answer 1

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

那应该做你想要完成的事情。