html - div最大高度

Question

我有3个div

<div id="div1" style="float:left;">
</div>

<div id="div2" style="float:left;">
</div>

<div id="div3" style="float:left;">
</div>

大部分时候div3是最高的，我想让div1和div2和div3一样高，可以吗？

Answer 1

您可以使用 faux background或 holy grail technique .

或者，您可以使用一些 JavaScript...

var divIds = ['div1', 'div2', 'div3'],
    divs = [],
    divsLength = divIds.length,
    maxHeight = 0;

for (var i = 0; i < divsLength; i++) {
   var div = document.getElementById(divIds[i]);
   maxHeight = Math.max(maxHeight, div.offsetHeight);
   divs.push(div);
}

for (var i = 0; i < divsLength; i++) {
   divs[i].style.height = maxHeight + 'px';
}

jsFiddle .