CSS - 容器高度与父div相同的高度,除非父div小于容器div

时间:2015-06-02 14:02:01

标签: css inheritance height

我目前使用:height:inherit;得到父div高度,但是当我缩小窗口时,父div小于容器div,所以溢出:隐藏;隐藏了一半的容器内容。

是否可以使用css执行此操作?

这是代码:

<div id="container">
<div class="content">
    <div class="wrapper">
        Content here
    </div>
</div>

#container {
    float: left;
    height: 400px;
    width: 400px;
    background-color: red;
}
.content {
    float: left;
    height: inherit;
    width: 90%;
    overflow: hidden;
    position: relative;
    background-color: black;
}

.wrapper {
    width: 90%;
    height: 900px;
    position: relative;
    z-index: 99;
    background-color: blue;
}

http://jsfiddle.net/orymyjto/1/

2 个答案:

答案 0 :(得分:1)

您可能使用overflow属性来清除浮动,对吗?

然后将overflow: hidden更改为overflow: auto

答案 1 :(得分:0)

设置内容div min-height:400px; (替换高度)所以它永远不会小于容器,但可以根据需要变大。