Question

编辑：对不起，我不清楚。我的意思是我希望外部div只能直到触及窗口/父级的底部并且具有最大值。

我想要一个父div来伸展以适应它的孩子，但直到达到最大高度。解决方案必须跨浏览器，但只需支持Safari 7 +，iOS Safari 7.1 +，Chrome 30 +，FF 35 +，IE10 +。如下所示：

<!-- This would stretch to child's 200px height -->
<div class="outer">
    <div class="child">child</div>
</div>

<!-- This would stretch to until it reaches max height of 300px -->
<div class="outer">
    <div class="child">child</div>
    <div class="child">child</div>
</div>

CSS：

.outer {
    position: relative;
    max-height: 300px;
    overflow: hidden; /* is this the best way? */
}

.child
{
    position: relative;
    height: 200px;
    width: 200px;
    background-color: red;
}

我更喜欢只使用CSS。

Answer 1

尝试使用Enchantment代替distinct属性。

如何拉伸div以适应内容直到达到其父级的高度？

1 个答案: