我已经尝试过CSS并发现了一个问题。根据我的代码（http://jsbin.com/daguviluwo/1/edit?html,output），我想用“float：left”创建两个框，它们会自动调整它们的高度（=最大高度）。因此，我创建了他们的父（id =“content”）。我认为父母的身高应根据孩子的最大身高进行调整（但事实并非如此！）。然后，具有属性“height：100％”（红色框）的子项应具有与此父项相同的高度，并且与具有最大高度的子项（绿色框）相同。但是，它不起作用。
答案 0 :(得分：2)
只需将 display property value 的inline-flex添加到：
#content #leftcontent #rightcontent 同时将 size property value 的height:auto添加到：
#leftcontent #rightcontent
#content {
background-color: grey;
height: 500px;
width: auto;
display: inline-flex;
}
#leftcontent {
height: auto;
background-color: red;
display: inline-flex;
}
#rightcontent {
background-color: green;
height: auto;
display: inline-flex;
}<body>
<div id="content">
<div id="leftcontent">
<ul>
<li>The height of this div is set to 100</li>
<li>List 2</li>
<li>List 3</li>
</ul>
</div>
<div id="rightcontent">
<h2>This is my first header.</h2>
<p>Content.</p>
<h2>This is my second header.</h2>
<p>Content 2.</p>
</div>
</div>
</body>
注意：使用这种方法，您可以从左/右元素CSS中删除浮点数
答案 1 :(得分：0)
在元素上使用float时，该元素会保留内容的正常流量，并且就其父元素而言，其高度不计算。
示例
如果你有一个父元素，以及一个只有float: left;和height: 300px;的子元素，那么父元素就好像它根本没有子元素一样，它的高度将是0px（如果它有填充，则更多，但我们假设它没有）。如果孩子没有float，则父母会有height: 300px，因为您需要。
有一个技巧可以纠正＆＃39;这种行为使得即使子元素具有float，其高度仍然是其父元素的重要性。
https://css-tricks.com/snippets/css/clear-fix/
现在，关于孩子的height:100%，这只有在父母有height声明auto而不是height:300px的情况下才有效，如果你没有声明一个height:100% 。
示例
如果父级有height: auto并且您将孩子设置为{{1}}，那么它也将是300px。但是如果父级没有声明的高度（即它有{{1}}），则子级的高度为0px（如果有填充，则为更高，但我们假设它没有）