height: 100% for <div> inside <div> with display: table-cell

http://stackoverflow.com/questions/22220698/height-100-for-div-inside-div-with-display-table-cell

HTML

<div class="table">
    <div class="cell">
     <h5>
    <span>"CATxxx45asdfghj 654654654 654654 65465 46546 54654 654654 kl;lkjhgfdsaWERTYUIOPOIUYTREWxcvbnm,mnbvcx"</span>
  </h5>
        <div class="kitten">
      </div>
    </div>
   
        
            <div class="cell">
     <h5>
    <span>"CAT"</span>
  </h5>
        <div class="kitten">
      </div>
    </div>
        
</div>

CSS

.cell {
    border: 2px solid black;
    vertical-align: top;
    height:170px;
    width:200px; word-wrap: break-word;
    overflow:hidden;
    display:flex;
    flex-direction: column;
}
.kitten{
    background: url(http://www.placekitten.com/235/75) no-repeat center center; 
    background-size:contain;
    flex:1;
}