vertically centering text in a flex box

possible without another container?

HTML

<div id='container'>
    <div id= "top">
        some content!
    </div>
    <div id= "bottom">
        some content!
    </div>
</div>

CSS

#container{
    display: -webkit-flex;
    width:100%;
    height:300px;
    -webkit-flex-direction: column;
    -webkit-justify-content: space-around;
    background-color: gray;
}
#container div{
    text-align:center;
    background-color:red;
    //-webkit-flex: 1; //uncomment to see 2nd option
    //vertical-align: middle; //doesn't work
}