父母的100％Div高度？

Question

我正在努力想方设法让它的父亲成为100％的高度。 唯一的诀窍是父母的身高将是动态的。

有什么想法吗？ 我无法在任何地方找到解决方案？

Answer 1

那是因为没有一个干净的解决方案......他们都是黑客。 看到abcoder

你可以使用javascript / jquery，

$(function () {
    var maxheight = Math.max.apply(null,$('.col').map(function () {
        return $(this).height();
    }));
    $('.col').height(maxheight);
});

js小提琴 - 使用box-sizing以便我可以在列上添加一些填充，但并非绝对必要。

或者你可以将所有div包装在另一个div中，然后在包含div的垂直平铺背景上给出它们是单独列的外观，即使内部div不会一直向下延伸。

表或模拟表（使用CSS）也可以使用。

不过，我认为现在可能会有一些涉及CSS3的解决方案。 这个答案来自2011年，所以请用你的判断。

Answer 2

简短的回答，这取决于。

一个很好的简单方法（至少在我看来）是使用冲突的绝对定位：

div {
    position: absolute;
    bottom: 0px;
    top: 0px;
    width: 150px;
}

填充帐户，您可以在边距编码。 缺点是它会从页面流中删除元素，所以你必须绕过它。 此外，支持是IE7 +。

另一种方法（也是IE7 +）是使用display: table; 并display: table-cell; 。

#parent {
    display: table;
}
#parent div {
    display: table-cell; /* To make all children act as table-cells */
}