CSS - 让多个孩子成为最高孩子的身高 [英] CSS - making multiple children the height of the tallest child

问题描述

我如何让这两个字段集合成为最高字段的高度？这里的代码也可以在 http://jsfiddle.net/zpcXQ/2/ 上看到

How do I make both of the fieldsets be the height of the tallest one? Here's the code, which can also be seen at http://jsfiddle.net/zpcXQ/2/

<div id="parent">

  <form>
    <fieldset id="left">
        <legend>Left</legend>
        <p>line 1</p>
        <p>line 2</p>
        <p>line 3</p>
    </fieldset>

    <fieldset id="right">
        <legend>Right</legend>
        <p>line 1</p>
    </fieldset>
  </form>

</div>

---

---

fieldset {
    border: 1px solid green;
    width: 48%;
    position: relative;
}

#parent {
    float: left;
    width: 600px;
    position: relative;
}

#left {
    float: left;
}

#right {
    float: left;
}

推荐答案

jquery如下：

You can do this by using jquery as following:

var fieldSets = $("fieldset").toArray();
var highest = 0;
for(var i=0; i< fieldSets.length; i++){
    var tempHeight = $(fieldSets[i]).height();
    if(tempHeight > highest){
        highest = tempHeight;
    }
}
$("fieldset").height(highest);

这篇关于CSS - 让多个孩子成为最高孩子的身高的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！