Растянуть элемент <video> на всю высоту родителя

[Aleksandr.L]

Вроде как по спецификации height: 100% работает если у родительского блока явно указана высота. В моем случае у блока с классом video-wrapper высота — 250px. Самому элементу <video> я указываю width: 100% и height: 100%, но он почему-то не растягивается на всю высоту. Вопрос: в чем проблема?

 

Нужно, чтобы блок с классом controls "накладывался" на видео по нижней границе.

 

Фиддл: http://jsfiddle.net/y2p80pjo/

 

 

[Sensei]

Может соотношение сторон кадра не совпадает с оберткой и появляются полосы?

Если так, то помогло бы свойство «object-fit: cover» для видео.

Правда, оно в ИЕ не поддерживается.

[Aleksandr.L]

  On 3/2/2015 at 4:16 PM, Sensei said:

Может соотношение сторон кадра не совпадает с оберткой и появляются полосы? Если так, то помогло бы свойство «object-fit: cover» для видео. Правда, оно в ИЕ не поддерживается.

 

 

Логично. Ну ок.

[antonKar]

height: inherit? нет?

Edited March 3, 2015 by antonKar

[Sergik+]

height: 100vh ?

[Aleksandr.L]

  On 3/3/2015 at 4:42 AM, antonKar said:

height: inherit? нет?

 

Не катит. Да скорее всего это из-за соотношения сторон.

 

  On 3/3/2015 at 5:34 AM, Sergik+ said:

height: 100vh ?

 

Это относительно вьюпорта. А нужно от родительского блока.

[raptor-dm]

посмотри как здесь видео реализовано http://q26321xa.bget.ru/sis/
так нужно?

[Aleksandr.L]

raptor-dm, спасибо за ссылку, но я уже сделал.