jquery - div 的滚动条未正确显示（移位）

Question

如图滚动条移位，不知道为什么..内容div从导航栏底部到浏览器窗口末尾的高度。

这是缩短的代码：

<div id="bar">
   <-- BarContent -->
</div>
<div class="content">
</div>

CSS：

#containerContent .center .content
{
    padding-left: 30px;
    padding-top: 25px;
    padding-right: 30px;
    overflow-y: auto;
    overflow-x: hidden;
    height: 1px;
}

我的 div 的高度是用 jquery 设置的

$(document).ready(function () {
    $('#content').height($('#containerContent').height() - $('#bar').height());
}

我知道：*这不是使用 jquery 调整大小的问题（在 css 中使用正确的高度对其进行了测试）* div 占用了所有需要的空间

有人有想法或解决方案来使我的滚动条正确显示吗？

谢谢

更新

感谢 Jeremy Voges，此解决方案有效。

但是有没有可能在 IE 中适应滚动条的高度？firefox safari 等作品