Вертикально центр отзывчивый iframe

Question

Я использую технику described here, чтобы сделать iframe (видео) отзывчивым. По сути, iframe абсолютно позиционируется внутри элемента оболочки с шириной 100%. Элемент обертки имеет, это обивка устанавливается на основе соотношения сторон видео:

.embed-responsive { 
    position: relative; 
    /* video height/video width */ 
    padding-bottom: 56.2%; 
    height: 0; 
    overflow: hidden; 
} 
.embed-responsive iframe { 
    position: absolute; 
    top: 0; 
    left: 0; 
    width: 100%; 
    height: 100%; 
} 

мне нужно, чтобы иметь возможность центрирования IFRAME вертикально в родительском контейнере (который имеет высоту 100%).

Я достиг этого до использования this technique, но он работает только с элементами inline-block. Если я изменю .embed-responsive на inline-block, он сломается.

Так есть альтернатива (желательно CSS только) Техника, которую я могу использовать для вертикального центрирования iframe, в то же время сохраняя отзывчивость? Это должно работать при изменении размера браузера.

http://jsfiddle.net/benfosterdev/xfA3L/

Answer 1

Так что я понял это через 2 минуты размещения :)

Изготовление .embed-resposive абсолютно позиционируется с top:50% и маржинальной верхней равным половине отношения высоты (video height/video width)/2 я центрировать его по вертикали:

.embed-responsive { 
    position: absolute; 
    left: 0; right: 0; 
    top: 50%; 
    /* video height/video width */ 
    padding-bottom: 56.2%; 
    /* the above value * 0.5 */ 
    margin-top: -28.1%; 
    height: 0; 
    overflow: hidden; 
} 

Fiddle был обновлен.