Question

我在包装器中有3个div。其中一个div包含我的内容class="cont"这个div有一个动态高度。其他divs 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柱布局，请检查this 'holy grail' post。

为了触发百分比高度，应该知道父级的高度。此外，如果您希望它们全部显示在同一行，您的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/

CSS DIV高度100％

1 个答案: