如何设置元素的高度以填充父元素高度的其余部分?

问题描述:

截至目前,我在div B的内部有div A,并且A的高度设置为100%,因为我希望它覆盖从其开始到其父部分底部的所有内容。如何设置元素的高度以填充父元素高度的其余部分?

但是,将它的高度设置为100%并不表现我希望的方式(它会简单地跨越它的起点到其父母的底部),而是将其高度设置为准确匹配它的父分区。由于DIV A开始几百个像素向下格B的内部,这将导致一个DIV溢出额外的几百个像素以下的div B.

下例:

Example

真正的窍门是,DIV B需要能够根据其内容垂直扩展,而div A继续填充从其垂直开始到其父项底部的区域。

有没有其他方法可以考虑?我知道我可以使用计算单元,但是,在safari 6之前,calc不适用于safari,并且这将排除很多移动设备。

我可能会误解你的股利乙想什么在这里实现,但不会一

overflow:hidden; 

工作呢?

+0

我发布了这几秒后才意识到这一点。是的,它确实有效。谢谢。 – Eric

+0

取决于您在div A中放置了多少内容,例如,足以证明“height:100%”的使用是合理的,内容的底部将被隐藏。在某些情况下可能会出现问题,但对于问题提出的问题不是最佳解决方案。 –

+0

没问题,很高兴你把它分类! @FabrícioMatté我可能误解了原文,我以为Div A始终与其父母的高度相匹配 - DivB? – InsomniaBass