我可以看到公认的答案使用位置:绝对;而不是float: left。如果你想使用float:留给下面的结构，

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

给出位置:自动;赋给父节点，以包含子节点的高度。

.parent {
    position: auto;
}
.floatLeft {
    float: left
}

父结点有身高吗?如果你像这样设置父结点高度。

div.parent { height: 300px };

然后你可以让孩子像这样伸展到全身高度。

div.child-right { height: 100% };

EDIT

下面是如何使用JavaScript实现的。

我最近在我的网站上用jQuery做了这个。该代码计算最高div的高度，并将其他div设置为相同的高度。技巧如下:

http://www.broken-links.com/2009/01/20/very-quick-equal-height-columns-in-jquery/

我不相信高度:100%将工作，所以如果你不明确知道div高度，我不认为有一个纯粹的CSS解决方案。

对于父元素，添加以下属性:

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

然后是。child-right这些:

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

在这里可以找到更多关于CSS示例的详细结果，在这里可以找到关于等高列的更多信息。

如果你了解bootstrap，你可以通过使用'flex'属性轻松完成。你所需要做的就是将下面的css属性传递给父div

.homepageSection {
  overflow: hidden;
  height: auto;
  display: flex;
  flex-flow: row;
}

其中。homepagesection是我的父div。 现在在你的html中添加子div

<div class="abc col-md-6">
<div class="abc col-md-6">

abc是我的子div，你可以检查两个子div的高度相等，而不考虑边界，只要给子div边界

CSS表显示是理想的:

.parent { 显示:表; 宽度:100%; ｝ .parent > div { 显示:表格单元; } .child-left { 背景:浅蓝色; } .child-right { 背景:番木瓜; } < div class = "父" > < div class = "让孩子“> < / div > < div class = "生" >高< br >高< / div > < / div >

原来的答案(假设任何一列都可以更高):

你试图让父结点的高度依赖于子结点的高度而子结点的高度依赖于父结点的高度。不会计算。CSS Faux列是最好的解决方案。有不止一种方法。我宁愿不使用JavaScript。