title: containing a video background to a specific div
body: <p>I am struggling to place a video background into a div. The div happens to also have a height of 500px and a width of 100%, and I want the video background to fit across the entire div, responsive.</p>
  
  <p>HTML</p>
  
  <pre><code>&lt;div id="dev_cms_vid_cont"&gt;
      &lt;video id="cms_vid" loop muted autoplay poster="img/videoframe.jpg"&gt;
          &lt;source src="'.BASE.'images/cms-bg.mp4" type="video/mp4"&gt;
      &lt;/video&gt;
      &lt;div id="dev_cms_cont"&gt;
           // content
      &lt;/div&gt;
  &lt;/div&gt;';
  </code></pre>
  
  <p>CSS</p>
  
  <pre><code> #dev_cms_vid_cont {
      height:500px; 
      position:relative;
   }
   #cms_vid {
      position:absolute; 
      right: 0; bottom: 0;
      min-width: 100%; 
      height: 500px;
      width: auto; z-index: 100;
      background: url(../images/home-intros.jpg) no-repeat;
      background-size: cover;
      margin: 0 auto;
   }
  </code></pre>
  
  <p>I don't mind if it requires jquery to sort out, I just want to be able to have video backgrounds, contained within a specific div, and cover the entire div with the video (not necessarily the whole video in display). What am I doing wrong?</p>