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

div.parent { height: 300px };

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

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

EDIT

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

CSS表显示是理想的:

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

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

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

如果你了解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边界

<div class="parent" style="height:500px;">
<div class="child-left floatLeft" style="height:100%">
</div>

<div class="child-right floatLeft" style="height:100%">
</div>
</div>

我使用内联样式只是为了表达想法。

我在评论区用了这个:

.parent { display: flex; float: left; border-top:2px solid black; width:635px; margin:10px 0px 0px 0px; padding:0px 20px 0px 20px; background-color: rgba(255,255,255,0.5); } .child-left { align-items: stretch; float: left; width:135px; padding:10px 10px 10px 0px; height:inherit; border-right:2px solid black; } .child-right { align-items: stretch; float: left; width:468px; padding:10px; } <div class="parent"> <div class="child-left">Short</div> <div class="child-right">Tall<br>Tall</div> </div>

您可以将child-right浮动到右边，但在这种情况下，我已经精确地计算了每个div的宽度。

对于父节点:

display: flex;

儿童:

align-items: stretch;

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