Не удается получить боковую панель для расширения до родительского контейнера

Question

Как показано на этой скрипке, я не могу получить customer-sidebar желтого слева, чтобы расширить до высоты div справа.У меня есть раздел main-content справа, и у него есть некоторые партии, эти партии могут отличаться, и поэтому я хочу, чтобы боковая панель расширялась до той же высоты, иначе они будут иметь неравномерную длину.Я попробовал решение "clear fix", но оно мне не подходит.Может кто-нибудь дать мне указатель на то, почему это не работает и как это исправить?

Answer 1

Вы должны поместить их один в другой и поместить самый длинный в самый короткий.

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

Структура должна быть:

<div id="wrapper">
    <div id="shorter-box-with-yellow-bg">
        <div id="container-box-for-shorter-list"> //floats left
        </div>
        <div id="longer-box-with-blue-bg"> //floats right
             <div id="container-box-for-longer-list">
             </div>
        </div>
    </div>
 </div>

Answer 2

Один из способов - создать изображение высотой 1 пиксель и шириной 1000 пикселей [ширина вашей «обертки страницы»], охватывающее как боковую панель, так и активную поставку, и установить изображение в качестве фона в обертке страницы.называется техникой искусственного столбца.

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