title: How to make dynamic background image size?
body: <p>Is it possible to make height of the section to fit the height of the background with css?</p>
  
  <p>Right now it takes the height of the section content.</p>
  
  <p>CSS:</p>
  
  <pre><code>.content-block {
    background-size: cover;
    background-position: center center;
  }
  </code></pre>
  
  <p>HTML:</p>
  
  <pre><code>&lt;section id="header-section" class="content-block" style="background: url(./images/bk1.jpg)"&gt;
    &lt;div class="container"&gt;
      &lt;div class="row"&gt;
        &lt;div class="col-xs-6"&gt;Lorem ipsum dolor sit amet, consectetur adipisicing elit. Dolore, nam error praesentium dolorum quae provident nulla expedita? Libero, quia, perferendis, illo asperiores blanditiis impedit nemo consectetur commodi architecto cumque cupiditate.&lt;/div&gt;
        &lt;div class="col-xs-6"&gt;Lorem ipsum dolor sit amet, consectetur adipisicing elit. Possimus, officia, quasi, minus, quas odio explicabo similique blanditiis odit unde dolores assumenda aut sint incidunt eaque maiores recusandae eum quod voluptate.&lt;/div&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  &lt;/section&gt;
  </code></pre>