Как сделать вставки через айфрейм респонзивными?

Question

[Mixa]

Удивляет, что в век адаптивного дизайна различные сервисы, которые позволяют эмбедить свой контент, до сих пор используют фиксированные величины. Как быть, если вы хотетите, что бы все видео и другие хрени, втсавленные на сайт через айфреймы, не ломало внешний вид сайта при просмотре з мобильных устройств?

Answer 1

[Дмитрий Христоев]

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

Answer 2

[Денис Инешин]

Так задавайте iframe с ютубом размеры в процентах. Он вполне это умеет.
Точно так же можно менять размер iframe на media queries, думайте о нем как о картинке.