将父div设置为子div的绝对高度

时间:2019-02-14 10:34:51

标签: jquery height absolute

我有多个.parent div,每个div都包含一个绝对定位的.child div。 我使用以下代码设法将.parent的高度扩展到.child的高度。

但是,这会使每个.parent都具有相同的高度,这是站点中最大的.child的高度。 我需要每个.parent只能将其高度扩展到自己的.child,而不能更大。

有什么建议吗?

function parentHeight(){
     divHeight = $('.parent .child').height();
     $('.parent').css({'height' : divHeight});
 }
 parentHeight();

1 个答案:

答案 0 :(得分:1)

请尝试使用jQuery.each

function parentHeight(){
    $('.parent .child').each((i,el) => {
      $(el).closest(".parent").css({'height' : $(el).height()})
    });
 }
 parentHeight();
.parent {
  background-color: blue;
  width: 100px;
  display: inline-block;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<div class="parent"><div class="child" style="height:200px">A</div></div>
<div class="parent"><div class="child" style="height:300px">B</div></div>
<div class="parent"><div class="child" style="height:400px">C</div></div>