title: Embedding video as background in a div (bootstrap)
body: <p>I am trying to add a video in a div as background (.form-container), in the past I do the same for a full-background page, but in this case I need it only in the div, the problem: dunno how to do it, I was playing with the width, but the video don't cover the full div.</p>
  
  <p>This is a full-background video, but obviously don't work. I was trying to play with the z-index, but I am very lost in how twitter-bootstrap handle the z-index:</p>
  
  <pre><code>#main video {
      background: #222;
      position: fixed;
      min-width: 100%;
      min-height: 100%;
      width: auto;
      height: auto;
      z-index: -100;
      transition: 1s opacity;
      opacity: 0.5; 
  }
  </code></pre>
  
  <p><strong>See the demo: <a href="http://codepen.io/wiitohzjeh/pen/vEgmEO?editors=110" rel="nofollow">http://codepen.io/wiitohzjeh/pen/vEgmEO?editors=110</a></strong></p>
  
  <p>When I try to change the width to 100% and set the max-height to 250px for 'fit' the div..</p>
  
  <pre><code>#main video {
      background: #222;
      position: fixed;
      width:100%;
      max-height: 250px;
      transition: 1s opacity;
      opacity: 0.5;
  }
  </code></pre>
  
  <p><strong>See the demo: <a href="http://codepen.io/wiitohzjeh/pen/LExyEK?editors=110" rel="nofollow">http://codepen.io/wiitohzjeh/pen/LExyEK?editors=110</a></strong></p>