выравнивание div и проблемы с поплавком

Question

Я воссоздаю сайт AACC (страница here) и столкнулся с некоторыми проблемами, пытаясь выровнять столбцы посередине под названием «Национальная инициатива», «Ведущее продвижение» и «Награды Программа». В моем исходном коде, который можно просмотреть с помощью css here, я создал его так, чтобы баннер с изображением клинтона плавал слева от области входа и боковой панели. Однако, если я использую ясно: оба, первый столбец (который отображается в нижней части моей страницы), остается под боковой панелью справа. Я не совсем уверен, как это исправить, возможно, я просто помещаю ясное свойство в неправильное место в коде или что-то еще, что может быть. Просто можно было использовать свежий набор глаз.

Вот код CSS, где я думаю, что проблема может быть исправлено:

#banner {float: left; width: 730px;} 

#logbar { 
background-color: rgb(95, 193, 47); color:#FFFFFF; padding: 3px; margin-left: 740px; width: 240px; height: 130px;} 

#sidebar{margin-left: 740px; width: 240px; height: 700px; padding:1px; background-color: #66CC66; margin-top: 3px;} 

#col1{float:left; width:236; height;300px; background-color:rgb(204, 227, 251);} 

Answer 1

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

#col1 { 
    top: 420px;   /* Add this */ 
    position: absolute; /* And this */ 
    width: 236px; 
    background-color: rgb(204, 227, 251); 
} 

Однако это действительно просто хак. Вы должны перестроить свой HTML. AACC не является хорошим примером - они используют таблицы для их компоновки. Посмотрите, как stackoverflow создает свою боковую панель для лучшего примера.