Как сделать видео с ютуба на странице сайта адаптивным?

kidink kidink   06.12.2017 12:28   146  
Столкнулся с такой проблемой. На странице http://rolgrad.ru/kupit-sekcionnye-vorota-cena.html моего сайта видео с ютуба с мобильного телефона выходит за грани, хотя все делал через bootstrap. Из за этого не совсем корректно отображается страница. Зайдите с телефона и посмотрите сами. В общем нужна помощь. Буду очень благодарен!
1
Ответы на вопрос (3) Написать ответ
ZAYMY
0
ZAYMY   06.12.2017 12:37
<div class="video-block"><iframe src="https://www.youtube.com/video" frameborder="0" width="756" height="428"></iframe></div>

.video-block {
position: relative;
padding-bottom: 56.25%;
padding-top: 30px;
height: 0;
overflow: hidden;
}
ZAYMY
kidink   06.12.2017 14:32  
спасибо, сейчас попробую
NiceATtacK
1
NiceATtacK   06.12.2017 14:55
В строке <iframe src="" frameborder="0" width="756"> Поменяй width="756" на width="100%" и не слушай предыдущего автора. Блок с видео сам растянется как нужно
snwebdev
0
snwebdev   06.12.2017 15:39
Я делаю так https://space.utema.ru/planet-earth-seen-from-space-full-hd-1080p-original/

<div class="video"><iframe width="100%" src="//www.youtube.com/embed/P5_GlAOCHyE?autoplay=1" frameborder="0" allowfullscreen></iframe></div>


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

Войдите, чтобы написать ответ
Вход Регистрация


Трафик интернет-магазинам
Контекстная реклама, не директ и не адвордс, жми!

Реклама здесь


Секрет подъема тИЦ - это безанкорные ссылки! Закажи 2750 dofollow ссылок сейчас за 650 р.. Проверено, 100% гарантия.