Помогите сверстать макет по примеру

[alleclf]

Есть 4 блока выстроенные в одну линию. Крайние два имеют фиксированную ширину (например 100 и 150 пх). Средние два блока одинаковой ширины и должны растянуться что бы вся конструкция заняла всю ширину экрана.

При изменении ширины окна браузера конструкция, сжимая\разжимая средние 2 блока, должна занимать всю ширину.

Для примера: https://jsfiddle.net/jjzycey8/2/

[by chris]

https://jsfiddle.net/jjzycey8/3/show/

[alleclf]

На компьютере работает, на планшете нет.

Не нравится поддержка "display: flex;" - http://caniuse.com/#search=flex

Может есть более универсальное решение?

Ведь средние два блока можно объединить в один а потом уже разделять.

[by chris]

2 часа назад, alleclf сказал:

На компьютере работает, на планшете нет.

 

display: -webkit-flex;display: -ms-flexbox;display: flex;

С префиксами работает везде, кроме ie9-

Вариант без модуля флексбокс

https://jsfiddle.net/jjzycey8/4/

Вариант  - имитирование таблиц, должен работать во всех динозврах

https://jsfiddle.net/jjzycey8/5/

Edited September 5, 2016 by by chris
upd

[alleclf]

by chris, отлично, спасибо