title: Background Image Stretch 100% Height of Div
body: <p>I have a container that will grow/shrink in height based on how much text is dynamically placed inside it. The container will have a background image that needs to stretch/shrink as the container changes height and this image cannot be cropped in any way. I am wondering how would I style <code>.container</code> to get the background-image to be stay 100% of the div.</p>
  
  <p>I have tried the following, but it didn't seem to work:</p>
  
  <pre><code>.container { background: url('backgroundImage.jpg') 0 100% no-repeat; }
  </code></pre>
  
  <p>Sample of HTML Structure:</p>
  
  <pre><code>&lt;div class="container"&gt;
    &lt;p class="text"&gt;This is a short container&lt;/p&gt;
  &lt;/div&gt;
  
  &lt;div class="container"&gt;
    &lt;p class="text"&gt;This&lt;br&gt; is&lt;br&gt; a&lt;br&gt; tall&lt;br&gt; container&lt;/p&gt;
  &lt;/div&gt;
  </code></pre>