Make child div take max height

I'm trying to make the .box-content div take the max height there is left inside boxA/boxB div. I got a div .box-header and a .box-content inside boxA/boxB div. The .box-content is sharing a div with the .box-header.

In this JSFiddle you can see that the .box-content is going outside it's parent div.

How can I solve this with pure CSS taking in account with these 2 rules:

1. The height of the .box-content is stretchable (grow/shrink whenever window size changes);
2. The .box-content has a minimum height of 200px;