CSS height:100%时min-Height: 100%导致布局变化

问题遇到的现象和发生背景

异常:给子元素1(表格页)设置min-Height:100%后,子元素2(页脚)会溢出页面(父元素),子元素2的高度被子元素1占有。
正常:只给子元素1(表格页)取消min-Height:100%后只留height:100%,子元素1和2共同撑起父元素。

用代码块功能插入代码,请勿粘贴截图

代码太乱太多,不放了。我只想知道产生这种情况的可能原因。

运行结果及报错内容

设置min-Height:100%时异常截图:

img

取消min-Height:100%后正常截图:

img

我想要达到的结果

我不明白,我的高度是height:100%,我设置个min-Height: 100%;怎么会导致高度变化呢(子元素1“表格页”的内容并不高,且是固定高度))?
哪位帮忙解答下可能是什么原因?

min-Height: 100%; 是指最小高度是100% ,高度会被内容撑开,内容有多高 就会被撑多高。你这有可能是padding margin 之类的导致的 ,height:100% 是高度定死100% ,不会被内容撑开,超出部分 可用 overflow 设置样式

min-height是最小都是 100%高度,就算没有内容也会 撑开