Fill the horizontal space between left and right floated elements

Fill the horizontal space between left and right floated elements

I found an answer here that addresses what I need to do, but it doesn't
seem to work perfectly for me. I have sidebar divs floated left and right.
I want to stick a div in the middle and fill the space. The technique in
that answer works for the left div, but it pushes the right div down to
the next line. I threw up a quick demo on CodePen to show the problem.
Can anyone suggest a way to fix this so that all the divs are on the same
line?
Update: I realize I could do this easily using percentages for all the div
widths, but I really need to maintain static widths for the sidebars.