title: Move div to bottom of the screen with css transform
body: <p>I want to move a div to the bottom of the screen.
  The translate property only moves the div in relation to its size:</p>
  <pre><code> &lt;html&gt;
    &lt;body&gt;
      &lt;div class=&quot;test&quot;&gt;&lt;/div&gt;
    &lt;/body&gt;
  &lt;/html&gt;
  
  html, body{
    margin: 0;
    width: 100%;
    height: 100%;
  }
  
  .test{
    height: 25%;
    width: 100%;
    transform: translate(0,100%);
    background: blue;
  }
  </code></pre>
  <p>This will move the div downwards by 100% of it's height (25% of the screen).
  How can I move the div to the bottom of the screen?</p>
  <p><a href="http://codepen.io/anon/pen/dXWGAm" rel="nofollow noreferrer">http://codepen.io/anon/pen/dXWGAm</a></p>