How to make the center column rubber?

Question

css

There are 3 block layout.
Left and right columns fixed width.
The central rubber, but the main condition is that its minimum width can be 200px and maximum 400px.
Made it like this .
But when resizing, the central block does not shrink a damn thing. More precisely, it shrinks, but at the beginning the structure breaks, the blocks go under each other, and only then the central one begins to shrink.
I don't understand how to solve the problem.

Answer 1

Is it okay?
https://jsfiddle.net/m5hw3chp/2/