Is it possible to fill the vertical space with an element inside a flexbox item

Is it possible to fill the vertical space with an element inside a flexbox
item

Flexbox items, by default, fill the space in the cross axis, which is
great. But then what happens if I want an item inside of the flex-item to
fill that space as well.
Here's a codepen example of what I want: http://codepen.io/anon/pen/FBhfl
Here's the HTML:
<div class="flex-container">
<div class="flex-item">
<div class="inner-item">I want to be 100% of my parents height without
having to modify the style of my parent element. Is this possible?
</div>
</div>
And the CSS:
.flex-container {
display: flex;
flex-direction: column;
height: 100vh;
}
.flex-item {
flex: 1;
background: yellow;
}
.inner-item {
padding: 1em;
background: gray;
}
I know that I can set .flex-item to display:flex as well, but for my
specific situation, I don't want to have to do that if possible.
From how I read the spec, this isn't possible, but I'm hoping I'm missing
something. Anyone?