<div id="div1">
<div id="div2">
// content set the height of div 2
</div>
</div>
在重新调整浏览器大小时,我目前仍然坚持让我的子div可滚动。
div1
将根据浏览器窗口高度调整大小。
当浏览器重新调整大小时,div2
会有一个滚动条(css属性溢出y)
div2
的高度。 div2
没有固定的高度,其高度取决于它所拥有的内容。
因此,如果浏览器窗口高度低于div2
内容高度,则显示滚动条。
答案 0 :(得分:2)
您可以像这样使用max-height
:
html,body {
height:100%;
}
#div1 {
background:red;
color:white;
height:100%;
}
#div2 {
background:black;
max-height:100%;
overflow-y:auto;
}
选中 Demo
答案 1 :(得分:0)
谢谢denko ..演示,是我正在寻找的确切行为..尽管我的css反映了你的演示,我无法让它工作。 这是我目前的css。
<div id="container">
<div id="div1">
<div id="div2">
// content set the height of div 2
</div>
</div>
//css styles
#container{
position:absolute;
}
#div1 {
margin-right: 20px;
display: inline-block;
border-style: solid;
max-width: 700px;
min-width: 300px;
border-color: #999999;
border-width: 1px;
/* box-shadow: 0px 0px 1px rgb(109,109,110); */
/* float: left; */
padding-left: 10px;
padding-right: 10px;
margin-bottom: 20px;
position: relative;
height: 100%;
}
#div2 {
color: #6e6e6e;
font-family: arial;
font-size: 14px;
overflow-y: auto;
/* height: 225px; */
overflow-x: hidden;
position: relative;
min-height: 100%;
}