我有以下HTML:http://jsfiddle.net/fMs67/.我想让div2尊重div1的大小并滚动div3的内容.
这可能吗?
谢谢!
更新1:
当我问这个问题时,这是我过于简单的更高级的案例:http://jsfiddle.net/Wcgvt/.我需要某种方式,标题+它的兄弟div不会溢出父div的大小.
Chr*_*rew 42
添加position: relative到父级,和max-height:100%; 在div2工作.
<div id="div1" style="height: 500px;position:relative;">
<div id="div2" style="max-height:100%;overflow:auto;border:1px solid red;">
<div id="div3" style="height:1500px;border:5px solid yellow;">hello</div>
</div>
</div>
</body>?
Run Code Online (Sandbox Code Playgroud)
更新:以下显示"已更新"的示例和答案.http://jsfiddle.net/Wcgvt/181/
使用的秘密box-sizing: border-box,以及一些填充使第二个div高度达到100%,但将其内容降低50px.然后将内容包装在div中overflow: auto以包含滚动条.注意z-indexes以保持所有文本可选 - 希望这会有所帮助,几年后.
这就是你想要的吗?
<body>
<div id="div1" style="height: 500px;">
<div id="div2" style="height: inherit; overflow: auto; border:1px solid red;">
<div id="div3" style="height:1500px;border:5px solid yellow;">hello</div>
</div>
</div>
Run Code Online (Sandbox Code Playgroud)