不同的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一些基本的素描漆什么的，所以我们可以帮你吗？

修改：也许我不明白的东西在这里，但这正是它的外观在我的Chrome窗口（当然，除了填充）