title: Child DIV with dynamic height and absolute position - Give height to parent DIV
body: <p>(Please keep in mind I am not code savvy)</p>
  
  <p><a href="http://sebcastilho.com/" rel="nofollow">http://sebcastilho.com/</a></p>
  
  <p>I want the image slider to stretch to the full width of the browser. The website's theme uses some responsive code and so the width of parent DIV of the slider can't be set to 100%.</p>
  
  <p>So the solution is to 'position: absolute' to get the slider to fit 100% width of the browser. However, when I do this, the browser doesn't know how high the content of the slider is and so the next sections of the website end up moving up and being covered by the slider.</p>
  
  <p>How can I get the parent DIV of Royal Slider to change height dynamically based on the height of the slider (which itself is dynamic based on how many pixels wide it is)?</p>
  
  <p><strong>EDIT</strong> (After ncardeli's answer)
  I got this piece of code I found working. It gets the height of the slider div (the one that has the position: absolute) and gives the height to the containing div. </p>
  
  <pre><code>$(document).ready(function(){
      var x = $('#new-royalslider-1').height();
      $('.photographySlider').css('height', x);
  })
  </code></pre>
  
  <p>My problem is that it doesn't refresh if the browser changes size. How can I achieve this?</p>