We created an HTML5 interactive for the front page of our website. We are having trouble getting an iframe containing the HTML5 to display in the slider region of the Shoot theme. We're able to display other types of content like an image, but not the iframe. We created a block using the following inline code: HTML5Wrapper { position: relative; padding-bottom: 45%; height: 0; } .HTML5Wrapper iframe { position: absolute; width: 100%; height: 100%; border: 0; overflow-y: hidden; } Note: the iframe source path has been omitted for privacy. On the block admin page, the block is added to the slider region and configured to display only on the page. Examining the source code of the front page reveals the style class definitions and iframe are there, but the iframe is not shown. The above code is proven to render the block responsively (i.e. dynamically resizes to the full width of the browser) on a separate page, but not on the front page using the Shoot theme. Thanks in advance for your response.
HTML5Wrapper { position: relative; padding-bottom: 45%; height: 0; } .HTML5Wrapper iframe { position: absolute; width: 100%; height: 100%; border: 0; overflow-y: hidden; }
Sorry for the duplicate posts. Here's the source used in the block to render the iframe: HTML5Wrapper { position: relative; padding-bottom: 45%; height: 0; } .HTML5Wrapper iframe { position: absolute; width: 100%; height: 100%; border: 0; overflow-y: hidden; }