css - CSS DIV 高度 100%

Question

我在一个包装器中有 3 个 div。此 div 之一包含我的内容class="cont"此 div 具有动态高度。其他 div navi-left 和 und navi right 应该有一个像 div cont 一样的高度。我已经尝试过了，但它不起作用。你能帮我吗？

<div style="width:400px;">
    <div class="navi-left" style="width:50px; height:100%; background:grey;"></div>
    <div class="cont" style="width:80px; height:80px; background:blue;"></div>
    <div class="navi-right" style="width:50px; height:100%; background:green;"></div>
</div>

Answer 1

如果您正在寻找等高的流体 3 列布局，请查看此“圣杯”帖子。

为了触发百分比高度，应该知道父级的高度。此外，如果您希望 DIV 全部显示在同一行上，则应内联显示它们。

<div style="width:400px;height:80px;">
    <div class="navi-left" style="width:50px; height:100%; background:grey;"></div>
    <div class="cont" style="width:80px; height:80px; background:blue;"></div>
    <div class="navi-right" style="width:50px; height:100%; background:green;"></div>
</div>

CSS

div {display:inline-block;}

小提琴：http: //jsfiddle.net/qvepX/