如何设置div以使用可用的浏览器高度自动调整其高度

Question

我有一个div(位置:固定),具有不同的高度,具体取决于其中的内容.要为我添加overflow-y:auto并指定固定高度的自动滚动.

有没有办法自动设置div的高度,以便当浏览器空间更改时,div的高度会相应更改,如果没有足够的空间,滚动条会出现,当有足够的可用空间时滚动条消失.

Answer 1

使用position:absolute而不是position: fixed使用左上角,右上角和右下角坐标并将滚动设置为自动;

示例HTML:

<div id="resize">
  <p>content</p><p>content</p><p>content</p><p>content</p>
</div>

CSS:

#resize {
background: #f00;
color: white;
position: absolute;
top: 100px;
left: 200px;
right: 200px;
bottom: 100px;
overflow: auto;
}

p {line-height: 3; margin: 0;}

工作实例:这里