滚动中间单元格的HTML"表格"？

Question

我已经浏览了Stack Overflow中的几十个例子,但我似乎无法做到这一点,并且它开始让我希望我选择了不同的职业!

我需要一个固定高度和固定宽度的表,有三行.

第1行将是可变高度,应根据内容增长和缩小,没有垂直滚动条.

第3行应固定在表格底部的高度.

第2行应占用所有剩余空间,但如果内容太大,则应包含垂直滚动条.

基本上,这是向用户显示电子邮件消息.第1行将包含所有标题和任何可选的标题,附件等(这就是为什么它需要是可变高度).

第2行是消息的正文,带有滚动条.

第3行用于操作按钮,删除,转发等.

整个事情需要固定高度和宽度,因为我需要将它嵌入到JQuery对话框DIV中.

在我的问题标题中,我把表放在引号中,因为我很高兴有一个只有CSS的解决方案,只要它按照描述的方式工作.对我而言,关键目标是我们以跨浏览器的方式实现上述功能.

希望你能帮忙!

Answer 1

首先,这是一个演示:小链接.

我所做的是不直接在中间单元格中包含文本,但是给它position: relative;,然后div使用以下内容创建一个内部:

position: absolute;
top: 0;
bottom: 0;
right: 0;
left: 0;
overflow: auto;

正如您在上面的演示中所看到的,这可以完成这项工作.

希望有所帮助!