如何在不使用min-height的情况下正确地将父容器调整为子容器

Question

问题示例：http://jsfiddle.net/uq0zzf7t/

我有以下css代码：

.wizard
{
    display: block;
    width: 100%;
}

.wizard > .steps
{
    position: relative;
    display: block;
    width: 100%;
}

.wizard > .content
{
    display: block;
    margin: 0.5em;
    position: relative;
    width: auto;
    min-height: 35em;
    overflow: visible;
}

.wizard > .actions
{   
    position: relative;
    display: block;
    text-align: right;
    width: 100%;
}

我的向导表单如下所示：

但是，如果我从.wizard＆gt;中删除min-height：35em。 .content，我得到以下图片

我的目标是使操作容器显示在内容容器的底部而不使用min-height。如果我的内容大于35em且溢出内容容器，这将非常有用。

内容子女不适合的示例：

所有容器都有从bootstrap应用的clearfix

以下是使用演示代码的jsfiddle中的问题示例：

http://jsfiddle.net/uq0zzf7t/

Answer 1

absolute个定位元素没有自动高度。您是否有任何理由将position: absolute提交给.wizard > .content > .body？

如果没有，则将其删除，div将根据其内容自动调整大小。

此SO answer

中的说明

Answer 2

您可以在父类中使用height: auto;属性。

查看此fiddle。