html - 使 block 适合其内容，但保留其 block 能力

Question

我正在尝试让一系列 block 适合各自的内容，但每个 block 都留在自己的行中:

+------------------------+
|        +--------------+|
|        | Some Content ||
|        +--------------+|
|  +--------------------+|
|  | Some Other Content ||
|  +--------------------+|
|               +-------+|
|               | Small ||
|               +-------+|
|               +-------+|
|               | Small ||
|               +-------+|
+------------------------+

我能找到的唯一想法是在 inline-block、float 或 position: absolute; 上工作，所有这些都会把同一行上的两个“小” block ...

关于如何实现它的任何想法？

我的 HTML 非常基础。它看起来像这样(但愿意接受建议):

<div class="container">
    <div>Some Content</div>
    <div>Some Other Content</div>
    <div>Small</div>
    <div>Small</div>
</div>

Answer 1

.container div {
    float: right;
    clear: right;
}

http://jsfiddle.net/VzT6P/1/