Css 如果高度超过xx%,另一个从属div占据页面的剩余高度,则获取div以滚动。

Css 如果高度超过xx%,另一个从属div占据页面的剩余高度,则获取div以滚动。,css,layout,scroll,height,grid-layout,Css,Layout,Scroll,Height,Grid Layout,我试图创建一个有6个垂直堆叠div的页面(从上到下:a、B、C、D、E和F)。分区B、C、D和F都使用静态像素大小调整高度(只有分区A和E具有可变高度)。Div E的内容可以是任意长度-其高度应在屏幕高度的10%到40%之间,如果内容太多,则应滚动。我已经尝试了一些解决方案,但我陷入了困境:目标如下: dive的CSS似乎没有任何用处 #E { min-height: 10%; max-height: 40%; } 我对在CSS中使用网格来调整flex的大小非常陌生——这也许是解决这

我试图创建一个有6个垂直堆叠div的页面(从上到下:a、B、C、D、E和F)。分区B、C、D和F都使用静态像素大小调整高度(只有分区A和E具有可变高度)。Div E的内容可以是任意长度-其高度应在屏幕高度的10%到40%之间,如果内容太多,则应滚动。我已经尝试了一些解决方案,但我陷入了困境:目标如下:

dive的CSS似乎没有任何用处

#E {
  min-height: 10%;
  max-height: 40%;
}

我对在CSS中使用网格来调整flex的大小非常陌生——这也许是解决这个问题的最好方法?我尝试过那种方法,但失败了

您几乎很好,只缺少了
html{height:100%;}wrapper{height:100%}
我通过调整表大小实现了这一点。我不确定这是否是一个好的方法,对于一般的响应性设计,但它是有效的: