title: The text won't go vertically centered?
body: <p>I've been trying to get the text to go vertically centered like this <a href="https://i.imgur.com/Vb7NuTV.png" rel="nofollow noreferrer">http://i.imgur.com/Vb7NuTV.png</a> but it doesn't seem to want to align.</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-css lang-css prettyprint-override"><code>@import url('http://getbootstrap.com/dist/css/bootstrap.min.css');
  h4 {
    margin-top: 25px;
  }
  
  .row {
    margin-bottom: 20px;
  }
  
  .row .row {
    margin-top: 10px;
    margin-bottom: 0;
  }
  
  [class*="col-"] {
    padding-top: 15px;
    padding-bottom: 15px;
    background-color: #eee;
    background-color: rgba(86, 61, 124, .15);
    border: 1px solid #ddd;
    border: 1px solid rgba(86, 61, 124, .2);
    height: 250px;
  }
  
  hr {
    margin-top: 40px;
    margin-bottom: 40px;
  }
  
  .innertext {
    display: inline-block;
    width: 90%
  }
  
  .label {
    position: absolute;
    top: 50%;
    margin-top: -10px;
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;div class="container"&gt;
    &lt;div class="row"&gt;
      &lt;div class="col-md-4"&gt;
        &lt;div class="innertext"&gt;Text Test Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text&lt;/div&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>Jsfiddle: <a href="http://jsfiddle.net/r0gsewtd/1/" rel="nofollow noreferrer">http://jsfiddle.net/r0gsewtd/1/</a></p>