bottom vertical align an h3 text with 100% height

To be clear, I am not interested in vertical aligning the h3 to the bottom of a div, or another block element. I know that already.

I have an h3 with 100% height. I want to vertically align the text in the h3 to the bottom.

Here's a Fiddle.

div {
    border: 1px solid #ccc;
    height: 200px;
    text-align: center;
    width: 150px;
}
h3 {
    height: 100%;
    vertical-align: bottom;
}

<div>
    <h3>Kitchen Experiments</h3>
</div>