Адаптивность видео, встраиваемого с YouTube

Возможно, ли как-то сделать видео, встраиваемое с YouTube, адаптивным в Bootstrap 3? IRFAME неуправляем :( Почему-то ширина, равная 100%, отлично работает, а вот высота, равная "auto" - совершенно не автоматизируется... Да и вообще, хотелось бы уйти от iframe. Есть ли альтернативный способ? Речь именно про видео с YouTube (HTML5 video работает, но нужно держать файл у себя на сервере)...

Комментарии: 1

Александр Мальцев
Александр Мальцев
Здравствуйте, в Bootstrap есть и для этого случая шаблон. Он может использоваться для элементов iframe, embed, video и object.
Например:
<!-- Соотношение сторон 16:9 -->
<div class="embed-responsive embed-responsive-16by9">
  <iframe class="embed-responsive-item" width="560" height="315" src="https://www.youtube.com/embed/p-Sdyj9qnmY" allowfullscreen></iframe>
</div>
<!-- Соотношение сторон 4:3 -->
<div class="embed-responsive embed-responsive-4by3">
  <iframe class="embed-responsive-item" width="560" height="315" src="https://www.youtube.com/embed/p-Sdyj9qnmY" allowfullscreen></iframe>
</div>

<!-- Атрибут frameborder="0" для элемента iframe указывать не надо -->