Как решать проблему с бордюрами у блоков с адаптивной высотой не используя таблицу?

Question

[atis //]

Блоки 1, 3, 4 имеют одинаковую высоту ( адаптивную ).
Блок 2 фиксированной высоты.
Как верстать это дело, и как решать проблему с бордюрами?

Answer 1

[Сергей]

Вариант 1: https://jsfiddle.net/b62qcp06/
Вариант 2: https://jsfiddle.net/w5jsb6dg/ (здесь разница в том, что блоки 3 и 4 взяты в отдельный блок)

Comments

[Сергей]

Совсем забыл спросить - а какая проблема с бордюрами?

[atis //]

ВоуВоуВоуВоу круто : ) но не то. высота 1, 3, 4 элементы могут быть разной высоты!
например высота: 1 - 100px, 2 - 20px, 3 - 80px, 4 - 80px.

[Сергей]

Вы же сами в вопросе написали, что у 1, 3, 4 - высота 100%
А в блоке 2 фиксированная и не меняется.
Теперь я задачи вообще не понимаю)))

[atis //]

Сергей Михалевич: вытягивание 1, 3, 4 элемента происходит синхронно!

[atis //]

Сергей Михалевич: на картинку посмотрите и добавьте по 500 пикселей в 1, 3, 4. еще 500. еще 100, понятно?

Answer 2

[gleendo]

Используйте flexbox

Comments

[atis //]

Не по душе мне флексбоксы

[HamSter]

а если под ие9 ?

Answer 3

[Антон Федорян]

Можно попробовать спозиционировать элементы: https://jsfiddle.net/slippyk/o2jxeg2z/1/

Comments

[atis //]

хэм. адаптивность сломает :)