Css 如何将左div扩展到剩余高度？

基本上，我有：

<div class="wrap">
<div class="sum">
little text
</div>
<div class="content">
long<br/>
long<br/>
long<br/>
long<br/>
long<br/>
long<br/>
long<br/>
text
</div>
</div>

<style>
.wrap{
height:100%;
overflow:hidden;
background:green;
}
.sum{
float:left;
height:100%;
background:yellow;
}
.content{
float:left;
height:100%;
background:red;
}
</style>

小文本
长

长

长

长

长

长

长

文本
.包裹{
身高：100%；
溢出：隐藏；
背景：绿色；
}
.sum{
浮动：左；
身高：100%；
背景：黄色；
}
.内容{
浮动：左；
身高：100%；
背景：红色；
}

如果您看到，sum div不会扩展到剩余高度以等于content div。 我只希望两个div处于相同的高度，而不指定它

我完全需要一个纯css，而不是javascript或表格

---

谢谢

这对您来说可能是一个更好的选择

或者查看人造柱：

---

这可能是一个更好的选择

或者查看人造柱：

---

如果不为这两个类设置特定的高度，那么没有一种纯粹的CSS方法可以做到这一点。检查这个：祝你好运。你想做的是CSS的圣杯。有很多黑客可以让它非常接近你想要的，但没有一个是完美的。我建议在谷歌上搜索一下。如果不为这两个类设置特定的高度，没有一种纯粹的CSS方法可以做到这一点。检查这个：祝你好运。你想做的是CSS的圣杯。有很多黑客可以让它非常接近你想要的，但没有一个是完美的。我建议用谷歌搜索一下。我已经用了很长时间的假专栏了。我已经用了很长时间的假专栏了。