?id=1f72c552-e2fd-4f76-8be5-c2e087f94967
TRUCO: Cómo hacer un IFRAME que ocupe el 100% de la altura
por José M. Alarcón
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 :-)
José Manuel Alarcón Aguín
Fundador de
campusMVP.es, el
proyecto de referencia en formación on-line para programadores en lengua española.
Autor de varios libros y cientos de artículos. Galardonado como
MVP de Microsoft desde 2004. Gallego de Vigo, amante de la ciencia y la
tecnología, la música y la lectura. Ayudando a la gente en Internet desde 1996.