Di base, l'iframe non presenta caratteristiche di reattività e la sua dimensione è quella specificata tramite i relativi parametri del tag iframe stesso.
Provare a forzare la dimensione in automatico tramite CSS genera errori nelle proporzioni.
Il dimensionamento corretto in funzione delle differenti viewport si ottiene con le regole CSS basate sull'aggiunta di un box contenitore e sul suo padding (vedere il codice della pagina):