html - 不同的 div 2 列布局

Question

这与简单的 2 列布局不同。

我需要这个html：

<div class="menu">
    <div class="right">One</div>
    <div>Three</div>
    <div>Four</div>
    <div class="right">Two</div>
    <div class="right">Two</div>
    <div>Four</div>
    <div class="right">Two</div>
</div>

div 类菜单具有静态宽度，我需要其中的 div 进入右列，而普通 div 保持原样。

这是我到目前为止得到的 CSS，但我似乎还无法弄清楚：

div.menu {
    width: 550px;
}
div.menu div {
    float: left;
    width: 200px;
}
div.menu div.right {
    float: right;
}

里面的 div 有随机顺序，所以我不能将它们包含在一个 div 中并浮动它。

这是上面 HTML 代码的粗略草图：

替代文字 http://img102.imageshack.us/img102/4494/flytc3.jpg

Answer 1

尝试：

div.menu div {
    float: left;
    clear: left;
}
div.menu div.right {
    float: right;
    clear: right;
}

Answer 2

我似乎无法弄清楚你想要达到什么目的。您能否在 MS Paint 或其他东西中创建一些基本草图，以便我们为您提供帮助？

编辑：也许我在这里不明白，但这正是它在我的 Chrome 窗口中的外观（嗯，除了填充物）。