flexbox model not producing 100% height of parent container

Using the following CSS:

#menusidebar {
    background-color: #6BC9DB;
    margin: 0 0 0 0;
    height: 100vh;
}

the left hand side sidebar of this page does not reach the bottom of its parent container #content-wrap.

Update: I tried using the flex box model:

.flex {
    display: -webkit-flex;
    display: flex;
    flex-grow: 1;
}

<div id="content-wrap" class="fluid clearfix flex" data-content="content">
  <aside role="complementary" class="two columns" id="menusidebar">

but the child of the flex element #menusidebar does not take up all remaining space of the flex parent #content-wrap.