html - 相对于 parent 的最大高度不起作用

Question

我正在尝试将大量内容放入“Thickbox”(Javascript 弹出窗口)中，它几乎可以正常工作，但我无法使 max-height: 100%;(相对于parent) 和 overflow-y: scroll; 工作。

有两种结果:

1. 它应有的长度，没有垂直滚动，并且超出了框的范围(太多了)。
2. 只要它应该的长度，垂直滚动并且它超出框(一点点)。

我只想将它放在框内，垂直滚动，我不想让它超出框外。一旦您查看了 JSFiddle，您就会明白我的意思:http://jsfiddle.net/m4aKk/ (最好在大屏幕上观看 - 1600px+)。任何建议都会很棒!

为什么 height: 100%; 或 max-height: 100%; 与其父级无关？

Answer 1

一个解决方案是使内框位置绝对。像这样:

#TB_ajaxContent {
    width: 440px;
    overflow-x: hidden;
    position: absolute;
    top: 30px;
    bottom: 10px;
}

这应该使内部 div 以您喜欢的方式定位。这是更新的 fiddle - 注意我已经删除了 height:auto; height:100% 来自内联样式。

这是让内部 div“与父元素一样高”的常用技巧。