我正在尝试在屏幕上填充2个div,其中一个位于页面底部,另一个位于“主要”内容区域。
我已经创建了一个jsfiddle来展示我需要的东西:https://jsfiddle.net/zmnogytL/1/
HTML看起来像这样:
<div id="parent">
<div class="messages">
<span id="jstext"></span>
</div>
<div class="input-area"></div>
</div>
当内容超出其高度时,主div(灰色的)不应该展开,而是在其中有一个滚动条。 较低的div(蓝色)应始终保持在同一位置。
经过无数个小时,我仍然没有按照我想要的方式工作。
提前致谢!
答案 0 :(得分:0)
试一试:
.messages{
overflow:scroll;
max-height: calc(100% - 100px);
}