Luckily, this is built into the flexbox model too. By default flexbox uses an element's automatic size as the basis to calculate its new size from.

However if you set flex-basis to zero then it will treat the element as if it was zero width for the purposes of calculating its new size from.

So if all elements have a zero basis then the flex ratio will be the only thing affecting their final width:

http://codepen.io/anon/pen/WvGLML?editors=110