CODEWITHSUNDEEP
javascriptjqueryhtmlcsstwitter-bootstrap
user1765862
user1765862

Reputation: 14145

change parents div height on childs element height

I have div page and inside that div I have bootstrap multiselect container

<div class="content clearfix">
   <ul class="multiselect-container dropdown-menu">
       <li> ...</li>
   </ul>
</div>

problem is that when there are many list items inside this multiselect element it stays hidden under parent div. How can I dynamically change parent div height as multiselection container element height change?

I tried already with 

.content.clearfix {
    height:auto;
}

but that doesn't helped

Upvotes: 1

Views: 67

Answers (1)

Yogesh Sharma
Yogesh Sharma

Reputation: 2017

Try JS to set height dynamically as per your multi-list element height. Check if it can help to you. I just put this code inside setTimeout because in case your li elements are taking time to load on page. Please try without setTimeout function first.

$(document).ready(function(){
setTimeout(function(){
var multiselectHeight=$('.multiselect-container').height();
  $('.content').height(multiselectHeight);
  
},1000);
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="content clearfix">
   <ul class="multiselect-container dropdown-menu">
       <li> ...</li>
   </ul>
</div>

Upvotes: 1

Related Questions