Question

我知道父div不能用纯CSS扩展到一个绝对定位的孩子的高度，我找到了一个用一些js解决这个问题的解决方案：http://jsfiddle.net/6csrV/7/

但如果您有多个列，每个列都绝对定位，并且您不知道哪个列最高？例如：

<div class="parentWrapper">
    <div class="column column1">This content may be 4 lines long</div>
    <div class="column column2">This content may be 8 lines long</div>
    <div class="column column3">This content may be 5 lines long</div>
</div>

要添加另一个挑战，列数也可能不同，因此应该可以定位通用＆＃34;列＆＃34; class而不是column1，column2，column3等...

为了让它更具挑战性，只有当浏览器视口比指定数量的像素更窄时才可以使用它吗？

Answer 1

对图层http://jsfiddle.net/saysiva/PuVvh/1/

使用height：auto

#container {
width:500px;
position:absolute;
left:200px;
vertical-align:center;
}

#mainContainer {
border:0px solid red;
height:auto;
}

#menu {
background-color:#FFD700;
height:auto;
width:100px;
float:left;
}

#content {
background-color:#EEEEEE;
height:auto;
width:400px;
float:left;
}

将父div扩展为TALLEST绝对定位子级的高度

1 个答案: