Css - size one floated column to same height as another

[Arewyh]

Reading through some of the answers to similar questions, I'm still not clear on whether this is possible.Consider the situation of 2 floated columns inside a clearfix-ed container. Column1's contents can grow and determine the height of the container. Column2's contents are always guaranteed to be less then Column1 but its height should stretch to fill the container.How on earth to get Column2 to stretch?Here's the jsbin (With Column2 not stretching)Things I do not want to do

• Use javascript
• Position absolute
• Use table html

I can figure out something with these techniques, but consider this an academic excercise. I'm trying to figure out whether css provides a "correct" solution that I can just commit to memory and be done with it. My suspicion is that the answer might be in one of the following techniques which I do not yet fully understand.

• Using the table css display types
• That whole flexbox thing coming out soon
• Whatever it is that twitter bootstrap does