Forçar todos os DIVs flutuantes para corresponder à altura da sua caixa

Question

Eu estou tentando descobrir uma maneira de fazer três divs flutuantes coincidem com a altura do maior div flutuante dos três (que, via a solução clearfix, é a altura de seu recipiente).

A minha pergunta é exatamente como esta questão , apenas a minha pergunta precisa a exigência de que os comentários para o mirante resposta :) ( 'what if as duas colunas têm diferentes cores de fundo?' etc)

Então, realmente eu não posso fingir. A página utiliza um mecanismo de arrastar e largar semelhante ao iGoogle usando scriptaculous, e os recipientes são classificáveis ??dragdrop divs flutuantes. Seria tornar as coisas muito mais fácil para o usuário se eu pode forçar todos os recipientes para ser a mesma altura.

Quanto mais eu procurar soluções, mais parece que ele não pode ser feito com CSS puro. Se for esse o caso e eu preciso usar algum javascript, que assim seja.

Agradecemos antecipadamente.

EDIT: O link de idrumgood era uma solução, mas não a solução acabei usando. Acabei portar a função jQuery ele sugeriu ao protótipo, a fim de conflitos evitar e para evitar ter que carregar toda a biblioteca jQuery para uma função.

Esta é a porta função javascript que eu acabei usando:

    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

Answer 1

Se você estiver ok com javascript / jQuery, aqui está a solução eu usaria .