elisabethdeim Posted June 13 Posted June 13 (edited) Can be closed // Found the typo. Hi Community, I added an iframe to one of my pages (https://www.elisabethdeim.com/infografik-illustration-die-welt-der-insekten) to embed an interactive infographic I made in Adobe Animate. I use an Embed Block to do this. After embedding the iframe, the navbar, footer and everything after the iframe disappears (many images of the project are placed after the iframe). If I check the code in Chromes Development Tools I come above this (see attached image). The iframe breaks the code, but I have no idea why. The page I load into the iframe: https://www.elisabethdeim.com/interaktive-infografik-die-welt-der-insekten (it uses a header code injection - issue occurs still when I delete this code) <style> .Header, .Footer, .Mobile-bar, .sqs-cookie-banner-v2 .sqs-cookie-banner-v2-cta-container, .sqs-cookie-banner-v2.DARK{ display:none !important; } .Main-content { padding:0; } The code I use in the embed-block: <div class="iframe-container"> <iframe class="responsive-iframe" scrolling="no" frameBorder="0" src="https://www.elisabethdeim.com/interaktive-infografik-die-welt-der-insekten"> <iframe> </div> And the code I inject to the header for this page: <style> .iframe-container { position: relative; overflow: hidden; width: 100%; padding-top: 335%; } .responsive-iframe { position: absolute; top: 0; left: 0; bottom: 0; right: 0; width: 100%; height: 100%; } </style> Does anybody see why adding the iframe destroys the code of the page? Edited June 13 by elisabethdeim Beyondspace 1
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment