我试图布置一个有两列的表格的页面。我想要最右边的列停靠在页面的右侧，并且此列应该有不同的背景颜色。右侧的内容几乎总是小于左侧的内容。我希望右边的div总是足够高，以到达它下面的行的分隔符。如何使我的背景颜色填充这个空间？
.rightfloat {
color: red;
background-color: #BBBBBB;
float: right;
width: 200px;
}
.left {
font-size: 20pt;
}
.separator {
clear: both;
width: 100%;
border-top: 1px solid black;
}
<div class="separator">
<div class="rightfloat">
Some really short content.
</div>
<div class="left">
Some really really really really really really
really really really really big content
</div>
</div>
<div class="separator">
<div class="rightfloat">
Some more short content.
</div>
<div class="left">
Some really really really really really really
really really really really big content
</div>
</div>
编辑：我同意这个例子很像表格，一个实际的表将是一个很好的选择。但是我的“真正的”页面最终将不像表一样，我只想首先掌握这个任务！
此外，由于某些原因，当我创建/编辑我的帖子在IE7，代码在预览视图中正确显示，但当我实际上发布的消息，格式化被删除。编辑我的帖子在Firefox 2似乎已经工作，FWIW。
另一个编辑：是的，我不接受GateKiller的答案。它确实工作在我的简单页面上，但不是在我的实际较重的页面。我会调查一些已经指向我的链接。
解决方法
…
The short answer to your question is that you must set the height of 100% to the body and html tag,then set the height to 100% on each div element you want to make 100% the height of the page.
实际上，100％的高度在大多数设计情况下不工作 – 这可能很短，但它不是一个好的答案。 Google“任何列最长”的布局。最好的方法是将左右列放在一个包装器div中，浮动左右列，然后浮动包装器 – 这使它伸展到内部容器的高度 – 然后在外部包装器设置背景图像。但是注意浮动元素上的任何水平边距，以防你得到IE“double margin float bug”。
