让元素在不使用display：table-row和absolute positioning的情况下获取剩余高度

Question

据我所知，一个相当常见的案例as demonstrated here通常通过以下方式解决：

• display:table-row至.titleBar和.content并将display:table应用于家长
• position:absolute到.content，所有四个轴都设置为0，以便元素延伸

不幸的是，在我的实际环境中，由于特定原因，我无法应用其中任何一种。

有没有办法让.content伸展到剩余的可用高度而不忽略.titleBar的高度（正如您在示例中通过向下滚动看到的那样）？

Answer 1

也许你应该像这样更改这些元素中的高度属性？

.outer .titleBar {
    height: 5%;
}
.outer .content {
    height: 95%;
}