CSS - 将child DIV height展开为父级的height [英] CSS - Expand child DIV height to parent's height

查看：111 发布时间：2017/1/17 23:57:38 html css layout

本文介绍了CSS - 将child DIV height展开为父级的height的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

我的页面结构如下：

<div class="parent">
    <div class="child-left floatLeft">
    </div>

    <div class="child-right floatLeft">
    </div>
</div>

现在， child-left DIV有更多的内容，所以 parent DIV的高度增加了每个子DIV。

Now, the child-left DIV will have more content, so the parent DIV's height increases as per the child DIV.

但问题是 child-right 高度不增加。

But the problem is child-right height is not increasing. How can I make its height as equal to it's parent?

为父元素添加以下属性

.parent {
    overflow: hidden;
    position: relative;
    width: 100%;
}

然后为 .child-right 这些：

.child-right {
    background:green;
    height: 100%;
    width: 50%;
    position: absolute;
    right: 0;
    top: 0;
}

You can find more detailed results with CSS examples here: http://jsbin.com/nimeguxuda/1/edit?html,css,output

这篇关于CSS - 将child DIV height展开为父级的height的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！

查看全文

CSS - 将child DIV height展开为父级的height [英] CSS - Expand child DIV height to parent&#39;s height