我有以下HTML:
http://jsfiddle.net/fMs67/.我想使div2尊重div1的大小,并滚动div3的内容。
这可能吗?
谢谢!
更新1:
这是比较先进的案例,当我提出这个问题时,我过分简化了:http://jsfiddle.net/Wcgvt/.我需要某种方式,这个标题是兄弟的div,不会溢出父div的大小。
解决方法
添加位置:相对于父对象,最大高度: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>
更新:以下显示“更新”的示例和答案。 http://jsfiddle.net/Wcgvt/181/
秘密是使用Box-sizing:border-Box和一些padding来使第二个div的高度为100%,但是将其内容移动到50px。然后将内容包装在具有overflow:auto的div中以包含滚动条。注意z索引以保持所有的文本可选 – 希望这有助于几年后。