Tengo un iframe que se vincula a una documentación de código Fortran creada con FORD . Tiene el mismo diseño que esta página. Quiero usar un iframe en mi sitio web Sphinx para mostrar su contenido en una de sus páginas. Sin embargo, vincularlo hace que el diseño del contenido del iframe no cambie como lo haría si solo se abriera la documentación. En cambio, empuja la ventana de tamaño completo hacia la izquierda para que solo la mitad sea visible, como en la siguiente imagen:
¿Hay alguna manera de reducir el contenido del iframe a medida que cambia el diseño de la ventana para que los bordes se minimicen primero y luego se muestre una barra de desplazamiento en la parte inferior? El iframe está incrustado en el sitio de la siguiente manera:
.. raw:: html <iframe src="path_to_FORD_documentation_index.html" style="position:fixed; top:auto; left:auto; bottom:auto; right:auto; width:100%; height:100%; border:none; margin:auto; padding:auto; overflow:hidden; z-index:999999;"> Your browser doesn't support iframes </iframe>Ya probé el enfoque basado en javascript de esta pregunta, pero esto solo creó una barra de desplazamiento en la parte inferior de la página principal pero no cambió el tamaño del contenido del iframe.
Sin tener mucho para continuar, creo que su problema está en sus propiedades de height y width . Su DOM está cargando el iFrame antes de que el iFrame cargue el contenido. Entonces, cuando se crea el elemento, no tiene ancho ni alto, por lo que el iFrame tiene como valor predeterminado mínimo alto/ancho. La solución podría ser precargar el enlace iFrame:
<link rel="preload" href="https://path_to_FORD_documentation_index.html" as="document"> luego llame a iFrame como lo hace ahora
O puede cambiar el tamaño del iFrame en una función y llamarlo después de que se cargue la página:
<script> iFrame.width = iFrame.contentWindow.document.body.scrollWidth iFrame.height = iFrame.contentWindow.document.body.scrollHeight </script>