css - 左 div 滚动和右 div 拉伸(stretch)布局高度/跨浏览器兼容？

Question

我想知道是否有可能让这样的布局跨浏览器兼容。我想在容器 div 中并排放置两个 div。右侧div的内容应该拉伸(stretch)整个布局的高度，或者说拉伸(stretch)容器div的高度。

在左边的 div 中，我想要一个固定高度的页眉和页脚 div。在这两个 div 之间，我想要一个可滚动的内容 div。此 div 应随着右侧 div 内容的增长而拉伸(stretch)。

我在谷歌浏览器中使用了这个:http://cssdesk.com/PFNuX

但是，它在IE和FF中不起作用。

我尝试了各种解决方案，包括 float div、表格、显示为表格的 div 等等，但我的解决方案都没有正常工作。只有上述解决方案有效，并且仅适用于 Chrome(我还没有尝试过 Opera 和 Safari)。

我的猜测是，通过使用一些 jQuery 或一些 JavaScript，我可以让它在所有浏览器中工作，但我还没有尝试过。我更喜欢在所有现代浏览器中仅使用 CSS 而没有 JS 的解决方案。

Answer 1

您必须使用 Javascript 来调整 <div> 的大小以适应内容。