mypage93
@mypage93
базовый верстальщик рисовальщик

Html код видео YouTube, растягивать высоту относительно ширины возможно?

Что можно указать в height, чтобы высота автоматически подстраивалась под ширину и не было чёрного фона по бокам видео? auto <- не работает.
<iframe width="100%" height="" src="https://www.youtube.com/embed/Zh1zprk92s8" frameborder="0" allowfullscreen></iframe>

039229d0fa474b4598283d5c88db266a.png
  • Вопрос задан
  • 5397 просмотров
Решения вопроса 1
Anna_BS
@Anna_BS
.video {
    height: 0;
    position: relative;
    padding-bottom: 56.25%;
}
.video iframe {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}

codepen
Ответ написан
Комментировать
Пригласить эксперта
Ответы на вопрос 1
@tecs
огромное спасибо.
только добавлю для пионеров:

<div class="video">
  <iframe id="youtube1" width="100%" src="https://www.youtube.com/embed/nWdInJYfcOY?controls=0" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы