Выровнять по вертикали левый, правый столбцы по динамическому среднему столбцу переменной высоты, используя только CSS?

Question

В приведенном ниже примере с jsfiddle я бы хотел, чтобы левый столбец (#left) и правый столбец (#right) были выровнены по вертикали с серединой среднего столбца (#middle). Высота среднего столбца (#middle) может варьироваться.

Это для мобильных устройств , следовательно, использование

text-overflow:ellipsis; 
white-space:nowrap; 
overflow:hidden; 

Эта часть работает, как требуется, при изменении размера экрана.

Может ли это быть достигнуто с помощью только CSS (без JavaScript)?

См .: http://jsfiddle.net/TGsdg/4/

Answer 1

Единственный способ сделать это - использовать display: table (-cell) с table-layout: fixed. Однако это будет работать только в том случае, если ваш правый и левый столбцы могут иметь фиксированную ширину:

http://jsfiddle.net/TGsdg/7/