Hoy he estado perdiendo un buen rato con esta tontería. Y es que parece mentira, pero si metes un <iframe> en tu página y le estableces sus propiedades width y height al 100% para que ocupen toda la página sólo te hace caso el ancho. El alto no funciona, da igual que lo pongas en sus atributos o en sus estilos CSS. No hace ni caso :-(

Tras romperme la cabeza unr ato he estado buscando en Internet y hay soluciones para todos los gustos, la mayoría de las cuales no funcionan. Además si funcionan en Internet Explorer no funcionan en Firefox o al revés. Es un verdadero peñazo.

Al final la solución pasa por establecer una serie de atributos para algunos tags de la página, así:

<style type="text/css">
    html, body, div, iframe { margin:0; padding:0; height:100%; }
    iframe { display:block; width:100%; border:none; }
</style>

Si no haces esto no hay forma de que pille el alto completo de la página. Así que ya lo sabes.

Espero que esto te sirve para que no pierdas tiempo como me pasó a mi :-)

💪🏻 ¿Este post te ha ayudado?, ¿has aprendido algo nuevo?
Pues NO te pido que me invites a un café... Te pido algo más fácil y mucho mejor

Escrito por un humano, no por una IA