title: text in a div overflows outside when it is aligned vertically center
body: <p>For some reason, when applying a pretty commonly used technique for vertically centering text content within a div, the text moves out of the div in some situations.</p>
  
  <p>Here is a link to an example of the problem: <a href="http://www.bootply.com/p4oma9jFjX" rel="nofollow">http://www.bootply.com/p4oma9jFjX</a></p>
  
  <p>Note that Example 1 and 2 work just fine but Example 3 demonstrated the problem.</p>
  
  <h3>css</h3>
  
  <pre class="lang-css prettyprint-override"><code>.search-result {
      background: grey;
      height: 200px;
      border-width: 10px;
      border-style: solid;
      border-color: white;
  }
  .search-result:before {
      content: '';
      display: inline-block;
      height: 100%;
      vertical-align: middle;
  }
  .item {
      display: inline-block;
      vertical-align: middle;
  }
  .ellipsis {
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
      width: 100px
  }
  </code></pre>
  
  <h3>html</h3>
  
  <pre class="lang-html prettyprint-override"><code>&lt;div class="col-sm-6 col-xs-12 text-center search-result"&gt;
      &lt;div class="item"&gt;
          &lt;p class="text-32"&gt;&lt;b class=""&gt;Example 1&lt;/b&gt;&lt;/p&gt;
          &lt;p class="small hidden-xs"&gt;&lt;b class=""&gt;Writer(s)&lt;/b&gt;&lt;br class=""&gt;Garry Bonner, Alan Gordon&lt;/p&gt;
          &lt;p class="small"&gt;&lt;b class=""&gt;Made Popular By&lt;/b&gt;&lt;br class=""&gt;The Turtles&lt;/p&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  &lt;div class="col-sm-6 col-xs-12 text-center search-result"&gt;
      &lt;div class="item"&gt;
          &lt;p class="text-32"&gt;&lt;b class=""&gt;Example 2&lt;/b&gt;&lt;/p&gt;
          &lt;p class="small"&gt;&lt;b class=""&gt;Writer(s)&lt;/b&gt;&lt;br class=""&gt;Harold Faltermeyer&lt;/p&gt;
          &lt;p class="small"&gt;&lt;b class=""&gt;Made Popular By&lt;/b&gt;&lt;br class=""&gt;Harold Faltermeyer, Beverly Hills Cop (Original Motion Picture Soundtrack), Crazy Frog&lt;/p&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  &lt;div class="col-sm-6 col-xs-12 text-center search-result"&gt;
      &lt;div class="item"&gt;
          &lt;p class="text-32 text-center"&gt;&lt;b class=""&gt;Example 3&lt;/b&gt;&lt;/p&gt;
          &lt;p class="small text-center"&gt;&lt;b class=""&gt;Writer(s)&lt;/b&gt;&lt;br class="ellipsis"&gt;Micayle Mckinney, Rosemarie Tan, Justin Walker, Jonathan James Yip, Jeremy Reeves, Ray Romulus, James Smith, Robin Tadross, Shannon Lawrence&lt;/p&gt;
          &lt;p class="small text-center"&gt;&lt;b class=""&gt;Made Popular By&lt;/b&gt;&lt;br class=""&gt;Danity Kane&lt;/p&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>