вертикальное выравнивание с text-overflow:ellipsis;
 

почти как обычно: выровнять блок вертикально по центру родителя, высота блока зависит от контента, родитель должен реагировть на переполнение по Y (переполняет выравниваемый блок) увеличением высоты или появлением скролла. Можно использовать продвинутый (-webkit) css.

Проблема в том, что блок содержит детей с overflow:hidden; + white-space:nowrap; + text-overflow:ellipsis; из-за чего стандартные способы ломаются:

1. display:table-cell; + vertical-align:middle;
http://jsfiddle.net/7Ewfx/7/
не срабатывает overflow:hidden; .

2. display:flex; + align-items:center;
http://jsfiddle.net/7Ewfx/8/
не срабатывает text-overflow:ellipsis; и блок с текстом смещается влево.

3. display:box; + box-align:center;
http://jsfiddle.net/7Ewfx/9/
не срабатывает text-overflow:ellipsis; и display:box; вроде как устарел.

Должно получиться вот так: http://jsfiddle.net/7Ewfx/10/ , но чтобы зеленый блок был в центре.
Кто-нибудь знает как это сделать?

danik.js,
спасиб, то что надо :)