CSS-将浮动子DIV的高度扩展到父级的高度

Question

CSS-将浮动子DIV的高度扩展到父级的高度我的页面结构如下：<div class="parent">     <div class="child-left floatLeft">     </div>     <div class="child-right floatLeft">     </div></div>现在，child-leftdiv将有更多的内容，因此parentDIV的高度随着孩子的DIV的增加而增加。但问题是child-right高度没有增加。我怎么能让它的高度和它的父母一样高呢？

Answer 1

为parent元素，添加以下属性：

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

然后为了.child-right这些：

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

使用css示例查找更详细的结果。

Answer 2

父母：

display: flex;

儿童：

align-items: stretch;

您应该添加一些前缀，检查caniuse。