title: How to make on div on top of another with table-cell?
body: <p>I'm trying to make two divs to be one on top of another, like this:</p>
  <p><img src="https://i.stack.imgur.com/imQsc.jpg" alt="the problem" /></p>
  <h2>The <a href="http://jsfiddle.net/eppwb0e1/" rel="nofollow noreferrer">fiddle</a>:</h2>
  <pre><code>&lt;!-- CSS --&gt;
  .table {
    display:table;
  }
  .div1 {
    display:table-cell;
    vertical-align:middle;
  }
  .div2 {
    display:table-cell;
    vertical-align:bottom;
  }
  &lt;!-- /CSS --&gt;
  &lt;div class=&quot;table&quot;&gt;
    &lt;div class=&quot;div1&quot;&gt;
      Top
    &lt;/div&gt;
    &lt;div class=&quot;div2&quot;&gt;
      Bottom
    &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>