Адаптивное видео по ширине экрана

Для того чтобы видео растягивалось до размеров родительского блока, достаточно в таблице стилей CSS, прописать:

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

Задаём относительное позиционирование для родительского блока и абсолютное относительно родителя, для встроенных элементов, определив им при этом, процентные значения ширины width: 100%и высоты height: 100%, чтобы видеоплеер смог растягиваться или сжиматься в соответствии размеров основного контейнера.

создаем div контейнер и внутри размещаем код нужного видеоролика.

<div class="video-responsive">
    <iframe width="auto" height="auto" src="ссылка на видео" frameborder="0" allowfullscreen></iframe>
</div>

1. CSS
2. Примеры