Адаптивные блоки YouTube

Видео YouTube вставляется через iframe, но он не адаптивен по высоте. Если задать width="100%", то он растянется на всю ширину родителя, но для высоты hight="100%" не работает. Это ведет к тому что на мобильных блок слишком высокий с черными отступами.

Далее приведено несколько примеров как это исправить, а также вывести несколько блоков в одну линию.

09.02.2019 , обновлено 30.08.2019
Предыдущая запись Настройка плеера YouTube
Следующая запись Сброс стилей (CSS reset)

Комментарии

, чтобы добавить комментарий.

Другие публикации

Пример как сформировать товарную накладную в с помощью класса PHPExcel. Скачать класс можно с официального сайта или...
27.01.2017 6970
Перетаскивание элементов списков, плитки и строк таблиц с помощью плагина jQuery UI Sortable и методы сохранения...
23.11.2017 12500
Примеры, как поместить элемент в центр родителя с помощью absolute, flexbox и grid layout.
11.10.2019 304
Сделать галерею которая заполнит все пространство фотографиями разного размера можно с помощью jQuery плагина...
04.04.2019 1183
Пример, как вывести Яндекс карту на всю ширину сайта + плавающий блок с контактной информацией.
12.01.2019 1777
Список параметров для настройки функций плеера YouTube, полное описание в документации на developers.google.com.
27.06.2019 1939