Различное расположение столбца div 2

Question

Это отличается от простого двухколоночного макета.

Мне нужен этот 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 (ну, кроме отступов).