Question

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

有关于此的任何想法吗？我无法在任何地方找到解决方案？

Answer 1

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

您可以使用javascript / jquery，

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

js fiddle - 使用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 */
}

父母的100％Div高度？

2 个答案: