Jquery 基于父对象调整子对象的大小

我有两张桌子。第一个表（我称之为表A）分配了一个

max height

，因此它下面的表（表B）将根据表A中是否有足够的内容来填充

max height

而向上移动。我需要让表B在不超出父容器的情况下填充剩余的空间（当表A没有填充

最大高度时）。我真的很想用CSS来做这件事，但我不确定我现在是否能做到（谷歌搜索了大约2个小时）。jQuery似乎是下一个选项，但我不太确定从哪里开始。

退房


无标题文件
标题1
标题2
内容
内容
内容
内容
内容
内容
内容
内容
内容
内容


节头
一排
第2排
第3排
第4排
第5行
第6行
第7排
第8行
第9行
第10行
第11排
第12行
第13行
如果您提供所有divs id，比如container、tab1、tab2，那么类似的方法是有效的：

$(document).ready(function() {
  $('#tab2').height(
    Math.max($('#container').height()
             -$('#tab1').height(), 0));
});

我更新了你的小提琴。添加/删除要测试的行

$(document).ready(function() {
  $('#tab2').height(
    Math.max($('#container').height()
             -$('#tab1').height(), 0));
});