Javascript 固定高度容器内的两个流体高度div

我几乎不敢问这个问题，因为它看起来很琐碎，但在stackoverflow和Google上花了3个多小时之后，我不得不试一试

我的问题是：

在初始状态下，

div#container

将包含

div#list-dynamic-2

，其中我希望

div#list-dynamic-2

使用

div#container

的全高

Div#list-dynamic-1

将被动态插入，并允许扩展到

150px

。一旦

div#list-dynamic-1

的高度达到

150px

，我希望

div#list-dynamic-2

使用

150px

的剩余空间。 如果有人能告诉我，仅仅用CSS实现这一点毫无意义，应该用JavaScript来实现，我也会很高兴

（顺便说一句，这是一个简单的例子来说明问题，实际使用方法是将选定的用户移动到上层div，并允许它使用1/2的

div#container

。将上层

div

想象成用户的某种购物车。）

这让我想起了。

---

请参见演示：

以下是一个javascript解决方案：

var iDiff = 300 - document.getElementById('list-dynamic-1').offsetHeight;
document.getElementById('list-dynamic-2').style.height = iDiff + 'px';

然后可以从

#list-dynamic-2

的css定义中删除

max height

和

height

另见

---

对于css，我认为你必须这样做，但大多数浏览器还不支持它。

是的，我想没有一个css唯一的解决方案，但嘿，你的解决方案非常出色，在IE中也能完美地工作。谢谢！：）@詹姆斯·蒙塔涅，谢谢！突出显示使它更具可读性，我会记得下次使用它！