Два столбца из нескольких делений

Question

Я делаю макет с двумя столбцами с divs. Это должно быть примерно так: http://dl.dropbox.com/u/4976861/html-demo.html

Но есть проблема. Если содержимое растягивает боковые блоки по вертикали, левые блоки сдвигаются вниз: http://dl.dropbox.com/u/4976861/html-demo-2.html

Если я добавлю боковую панель в div-оболочку, она будет работать нормально, но это сделает код немного грязным из-за отступов и некоторых фоновых проблем, которые я убрал, чтобы упростить демонстрацию, поэтому я бы хотел оставить этот параметр Теперь.

Answer 1

Я не думаю, что вы сможете получить желаемые результаты без изменения базового HTML. Вы пытаетесь разрешить элементам течь (как по вертикали, так и по горизонтали) внутри страницы, но порядок, в котором у вас есть элементы, не позволит этого сделать.

Возможно, я учу вас сосать яйца, но мои предпочтения в выводе HTML будут примерно такими:

<div class="wrap">
        <div class="column1">
            <div>left 1</div>
            <div>left 2</div>
            <div>left 3</div>
        </div>
        <div class="column2">
            <div>right 1</div>
            <div>right 2</div>
        </div>
 </div>

Answer 2

Поместите это под 2 деления:

<div style="clear:both;"></div>