Заставить все плавающие DIV соответствовать высоте их контейнера - PullRequest
Новая
       12

Заставить все плавающие DIV соответствовать высоте их контейнера

4 голосов
/ 05 августа 2009

Я пытаюсь найти способ сделать так, чтобы три плавающих делителя соответствовали высоте самого большого плавающего делителя из трех (что с помощью решения clearfix является высотой их контейнера).

Мой вопрос точно такой же, как этот вопрос, только мой вопрос нуждается в требовании, чтобы комментарии к ответу игнорировались :) ("что если два столбца имеют разные цвета фона?" И т. Д.)

Так что на самом деле я не могу подделать это. На странице используется механизм перетаскивания, похожий на iGoogle, использующий scriptaculous, а сортируемые контейнеры dragdrop представляют собой плавающие элементы div. Пользователю было бы намного легче, если бы я мог заставить все контейнеры иметь одинаковую высоту.

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

Заранее спасибо.

РЕДАКТИРОВАТЬ: ссылка от idrumgood была решением, но не решение, которое я в конечном итоге использовал. Я закончил тем, что портировал функцию jQuery, которую он предложил прототипировать, чтобы избежать конфликтов и избежать загрузки всей библиотеки jquery для одной функции.

Это порт функции javascript, который я использовал в итоге: 

    function equalHeights(container) {
    var children = $A(container.immediateDescendants());
    var currentTallest = 0;

    for (i = 0; i < children.length; i++) {
        if (children[i].getHeight() > currentTallest) {
            currentTallest = children[i].getHeight();
        } //end if
    } //end for

    for (i = 0; i < children.length; i++) {
        children[i].setStyle({ height: (currentTallest + 'px') });
    } //end for
} //end equalHeights

1 Ответ

3 голосов
/ 05 августа 2009

Если вы в порядке с javascript / jQuery, вот решение Я бы использовал.

...