CSS / Bootstrap: Text align vertically center
<p>I have a webproject using bootstrap.
There is an Layout with two columns. The left column has an image and the right one has an text. The text should be vertically centered to the image.
The first problem was to get the columns the same height.
I found the following working solution:</p>

<pre><code>.col {
  margin-bottom: -99999px;
  padding-bottom: 99999px;
  height:100%;
}
</code></pre>

<p>To get the text centered vertically I inserted the following html in the right row:</p>

<pre><code>&lt;div class="table"&gt;
  &lt;div class="cell"&gt;My text&lt;/div&gt;
&lt;/div&gt;
</code></pre>

<p>CSS:</p>

<pre><code>.table {
  height:100%;
  width:100%;
  display:table;   
}

.cell {
  display:table-cell;
  vertical-align:middle;
  height:100%;
}
</code></pre>

<p>But I don't get the table and its cell to height 100% of the parent. Position absolute not working too, because bottom:0 is 99999px;</p>

<p>Anybody has an idea what I can do? Thanks</p>