плавающие div, которые заполняют пространство до очистки div

Question

Чтобы получить представление о том, о чем я, черт возьми, пожалуйста, перейдите Здесь и Здесь

Как вы увидите, есть боковая панель и область контента, боковая панель плавающая влево, контент плавающая вправо, а нижний колонтитул очищает оба.

Высота на боковой панели и содержимое не заданы, поэтому элементы div растут!

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

Мне нужно знать, как сделать цвет фона обоих div всегда одинаковым и расти вместе в мире и согласии

Спасибо

Answer 1

display: table-cell для обоих div (и удаления поплавков) здесь может работать легко, хотя более низким IE это не понравится.

Или вы всегда можете использовать печально известный FauxКолонки

Answer 2

То, что вы спрашиваете, состоит в том, чтобы два div были одинаковой высоты, даже если их высота содержимого различна.Это невозможно сделать, не полагаясь на таблицы или javascript.

Что вы можете сделать, чтобы добиться того же эффекта, это иметь контейнер div (я вижу, у вас его уже есть) и дать этому вертикально повторяющееся фоновое изображениебоковая панель и цвет контента.Это известно как Faux Columns.

Обязательно очистите контейнер (переместите <div class="clear"></div> на один уровень вверх), чтобы контейнер получил высоту в зависимости от того, какой div больше.