将浮动div扩展为父容器的100％宽度

Question

我有一个包含评论的div容器。它被设置为向左浮动，并且化身容器在它旁边（它也浮动到左侧）。 这是一个截图。

白色评论容器的CSS：

.comment_content{
    float: left;
/*
    width: 86%;
*/
    margin-left:5px;
    padding-left: 15px;
    background: url(http://video.chubbyparade.com/img/arrow_left.png) no-repeat 0 8px;
}

我想将此容器设置为填充父容器中剩余空间的100％。

如果我将它设置为宽度：100％，我会得到一个换行符（因为它现在填充了父容器宽度的100％）。

如何设置注释容器以填充剩余空间？我以前通过将其设置为宽度来执行此操作：86％。但是如果我调整窗口大小（布局不是固定宽度），那看起来不太好。

表格是最简单的方法。但是css没有解决方案吗？

Answer 1

为什么不放置评论框而不是浮动，只需给出一个足够高的边距以清除头像图像。例如如果化身宽度为150px，请给出注释框margin-left: 155px;，因为注释框是div（块元素），它将自然地填充父div的剩余空间。

这里的jsfiddle示例： http://jsfiddle.net/UHksQ/

<强>样式：

.avatar {
    float: left;
    width: 150px;
}
.comment {
    margin-left:155px;
}

Answer 2

Dave Haigh的解决方案是一种合理的方法。如果你真的，真的坚持使用花车，你可以将容器的左侧填充到肖像的宽度，然后给肖像留下100％的边距。这有点傻，但它会起作用。

jsFiddle演示：http://jsfiddle.net/Malkyne/FZcPq/