title: bottom vertical align an h3 text with 100% height
body: <p>To be clear, I am not interested in vertical aligning the <code>h3</code> to the bottom of a div, or another block element. I know that already.</p>
  
  <p>I have an <code>h3</code> with 100% height. I want to vertically align the text in the <code>h3</code> to the bottom.</p>
  
  <p>Here's a <a href="http://jsfiddle.net/7Lcvy/" rel="nofollow">Fiddle</a>.</p>
  
  <pre><code>div {
      border: 1px solid #ccc;
      height: 200px;
      text-align: center;
      width: 150px;
  }
  h3 {
      height: 100%;
      vertical-align: bottom;
  }
  
  &lt;div&gt;
      &lt;h3&gt;Kitchen Experiments&lt;/h3&gt;
  &lt;/div&gt;
  </code></pre>