HTML / CSS: float left не работает правильно, div показывается ниже предыдущего div

Question

Я пытаюсь сделать макет из 2 столбцов, используя class = "left" и class = "right", в данный момент мой столбец .right не будет перемещаться влево и показывается ниже моего столбца .left.

Когда я удаляю все внутри .left и. Right, поплавок работает правильно, может кто-нибудь помочь мне понять, что я делаю неправильно?Спасибо

Answer 1

Ваш right div находится внутри вашего left div.У вас есть комментарий, который говорит </div><!-- left -->, но на самом деле это не конец левого div.Посмотрите на это в редакторе, который поддерживает подсветку блоков.

Answer 2

Если у вас есть отступы и / или поля, определенные в div .left и .right, убедитесь, что для каждого из них (с содержимым) есть место для отображения рядом.

Я считаю это полезнымпоставить рамку в 1 пиксель вокруг элементов во время работы над исходным макетом, чтобы действительно получить представление о том, где все находится.

Answer 3

В вашем коде .left, кажется, есть нераскрытый div.

Добавление другого конца div тега к концу этого блока, кажется, исправляет это.

http://jsfiddle.net/SG8sE/4/