我有两个divscolumns。一个向左浮动，另一个向右浮动（我正在做一个响应式设计的页面，需要这样）。左边div的内容远远地延伸到viewportleft div下面，而右边的内容比较短，并保持在viewportright div内。
我需要背景色一直扩展到左边div的内容（如果是右边div的内容较长，则是右边div的内容）的底部。
相反，它是切割背景颜色div的权利在视口的底部.我已经尝试了clears:both的，clearfix和溢出控件，没有用。我想我没有正确地实现它们的设置。谁能编辑一下我的fiddle，告诉我需要怎么做才能让它们延伸到底部？
这里是fiddle（你需要在小视窗中向下滚动以查看它是如何切断颜色的）。
这是我在fiddle中使用的代码。
<html><head></head><body><style>
html, body {height:100%;}
#content {
height:100%;
border:thin solid red;
}
#innerdiv {
height:100%;
float:left;
background-color: #eee;
width: 60%;
}
#innerdiv2 {
height:100%;
float:right;
background-color: blue;
width: 40%;
}
#textdiv {
height: 100%;
padding-left: 40px;
}
#textdiv2 {
height: 100%;
padding-left: 40px;
colo: white;
}
</style>
<div id="content">
<div id="innerdiv">
<div id="textdiv">
Filler<br />Filler<br />Filler<br />Filler<br />Filler<br />Filler<br />Filler<br />Filler<br />Filler<br />Filler<br />Filler<br />Filler<br />Filler<br />Filler<br />Filler<br />Filler<br />Filler<br />Filler<br />Filler<br />Filler<br />Filler<br />Filler<br />Filler<br />Filler<br />Filler<br />Filler<br />Filler<br />Filler<br />Filler<br />Filler<br />Filler<br />Filler<br />Filler<br />Filler<br />Filler<br />Filler<br />Filler<br />Filler<br />Filler<br />Filler<br />Filler<br />Filler<br />Filler<br />Filler<br />Filler<br />Filler<br />Filler<br />Filler<br />
</div>
</div>
<div id="innerdiv2">
<div id="textdiv2">
Filler<br />Filler<br />Filler<br />Filler<br />Filler<br />Filler<br />
</div>
</div>
</div>
</body></html>
#content { height:100%; } 不起作用，因为这个高度是指父元素的高度，而不是由 "产生 "的高度。#content的内容... 这意味着 #content 只到 <body> 是，这同样不是整个页面的高度，而是 "显示区域 "的高度。
不要定义任何高度的 #content 而后 #innerdiv2 另加 <div> 与 height:0; 和 clear:both;.
应该可以做到这一点，而且不会打扰你或任何人:)