只使用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。但是，只有你的权利和权利，这才有效。 left colums可以有一个固定的宽度：

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