如何在css网格中结合最小最大值函数和vh？

我想将移动视图中的一行高度设置为最大670px，低于最小100vh，但当我这样写时：

@media only screen and (max-width: $bp-mobile) {
    grid-template-rows: minmax(100vh, 67rem) repeat(7, max-content);
  }

如果视口高度等于1000px，它总是将我的第一行扩展到100vh。我的行的高度为1000px。如何将

vh

组合到低于该特定最大高度

670px

的位置，使其始终

100vh

和高于

670px

的位置，以将此行锁定到高度

670px

.container{
显示：网格；
边框：2倍纯红；
网格模板行：最小最大值（100vh，67rem）1fr；
}
.测试-1{
背景颜色：橙色；
}
.测试-2{
背景色：青色；
高度：30雷姆；
}

1.
2.

您可以使用

最大高度

完成此操作，如下所示：

.container{
显示：网格；
边框：2倍纯红；
网格模板行：自动1fr；
}
.测试-1{
背景颜色：橙色；
高度：100vh；
最大高度：67雷姆；
}
.测试-2{
背景色：青色；
高度：30雷姆；
}
html{
字体大小：10px；
}

1.
2.