How to align div vertically in the middle?
<p>I have created this row with bootstrap 3:</p>

<pre><code>&lt;div class="cart"&gt;
&lt;div class="row border"&gt;
  &lt;div class="col-md-8 desc pad itemsheight"&gt;
    &lt;div class="col-md-12"&gt;
      &lt;!-- react-text: 141 --&gt;Docos
      &lt;!-- /react-text --&gt;
      &lt;!-- react-text: 142 --&gt;channel package
      &lt;!-- /react-text --&gt;
    &lt;/div&gt;
    &lt;div class="col-md-12 small"&gt;&lt;a href=""&gt;Change&lt;/a&gt;
      &lt;!-- react-text: 145 --&gt;|
      &lt;!-- /react-text --&gt;&lt;a href=""&gt;Remove&lt;/a&gt;&lt;/div&gt;
  &lt;/div&gt;
  &lt;div class="col-md-2 desc grey pad itemsheight"&gt;&lt;/div&gt;
  &lt;div class="col-md-2 dollar grey price middle space pad itemsheight"&gt;15&lt;/div&gt;
&lt;/div&gt;
  &lt;/div&gt;
</code></pre>

<p>The issue is that the text is not aligned in the middle vertically aligned. I tried to use vertical-align but does not work? Here is another sample: <a href="http://codepen.io/gekkerkanniet/pen/jVKoyR" rel="nofollow noreferrer">http://codepen.io/gekkerkanniet/pen/jVKoyR</a></p>