title: Increase height of outer div when height of child div increases
body: <p>I am working on an <code>asp.net</code> web application. </p>
  
  <p>There is a child form of a <code>master page</code>. Master page has not defined any height but it has defined a <code>X px</code> height for the <code>child form</code>.</p>
  
  <p>On the child form it has one <code>fieldset</code> container and within this 2 <code>table container</code> and one <code>container</code> for <code>gridview control</code>.</p>
  
  <p>As per my knowledge I have set the height of <code>#mainOuter_box</code> as <code>auto</code> and height of child form container (<code>#child_contentbox1</code>) as <code>auto</code> too.</p>
  
  <p>but this strategy is not working as desired. However I have tried this one code sample too (which I got from this stackoverflow question thread <a href="https://stackoverflow.com/questions/1881032/how-to-size-a-divs-height-to-its-container-height-using-css">how to size a div&#39;s height to its container height, using CSS?</a> but I have doubt if I have written it properly.</p>
  
  <p><code>$(document).ready(function(){
  $("#mainOuter_box").css('height',$("#child_contentbox1").innerHeight()+$("#child_contentbox2").innerHeight()+$("#child_contentbox3").innerHeight());
  });</code></p>
  
  <p>please suggest me how can I increase the height of <code>#mainOuter_box</code> when, the data/records increase the height of the <code>gridview</code> container box.</p>
  
  <p>Thank you!
   <strong>update</strong> here is jsfiddle link, where i have attached css and html of master form. 
  Thanks so much for your kind guidance!!
  <a href="http://jsfiddle.net/nikhilbs09_1/325oes4m/" rel="nofollow noreferrer">http://jsfiddle.net/nikhilbs09_1/325oes4m/</a></p>