How to auto iframe width 100% - rasgane

Pejelasan

Mungkin ada yang kesulitan menyesuaikan ukuran iframe terutama video, harus buat secara manual dan harus atur tiap mode desktop, Tablet/Mobile dan itu cukup merepotkan.

Jadi ini bisa diterapkan dengan mudah dan simpel. Untuk video yang Vertical tampilannya akan tetap Horizontal tapi video tetap akan sama dan tidak akan terpotong (Crop)

• Results
• Code

Horizontal

Vertical

<div class="iframe">
    [Tag Iframe is Here]
</div>

.iframe{position:relative;z-index:1;max-width:100%;height:0;padding-bottom:56.2%}
.iframe>iframe{position:absolute;border:none;width:100%!important;height:100%!important;top:0;left:0;margin:0;padding:0;z-index:2}

Referensi : https://www.dayat.id