title: How to center vertically and horizontally a div using Bootstrap?
body: <p>I have a problem with my CSS. I have a panel form in my index page and I want to move it in the middle of the page vertically and horizontally. But I don't know how to create a CSS for this.</p>
  
  <p>Here's my sample code:</p>
  
  <pre><code>&lt;div class="login_header"&gt;&lt;/div&gt;
  
  &lt;div class="container" style="text-align: center;"&gt;
      &lt;div class="col-md-6 col-md-offset-3"&gt;
          &lt;div class="panel_form panel panel-default"&gt;
              &lt;div class="panel-content"&gt;
                  &lt;h1&gt;test&lt;/h1&gt;
              &lt;/div&gt;
              &lt;div class="panel-footer"&gt;
                  &lt;p&gt;test&lt;/p&gt;
              &lt;/div&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  
  &lt;footer class="footer"&gt;&lt;/footer&gt;
  </code></pre>
  
  <p>I have a CSS like this:</p>
  
  <pre><code>.login_header { min-height: 50px; background-color: #f5f5f5; }
  
  .panel_form {
     /* I don't have an idea with this */
  }
  
  .footer { 
      position: absolute; 
      bottom: 0; 
      width: 100%;
      height: 50px;
      background-color: #f5f5f5;
  }
  </code></pre>
  
  <p>I am not good enough in CSS that's why I need your help. That's all thanks.. :)</p>