New in Chrome 154: iframes that automatically resize themselves to their content

~ Chrome 154 adds support for responsively-sized iframes, letting an <iframe> size itself based on the intrinsic size of its embedded document. This is perfect for seamlessly embedding third-party comment widgets, varying-height social media embeds, or any other type of embed that uses an <iframe>. ~ To make this work there is a two-way opt-in: The embedder (e.g. index.html) needs to set the frame-sizing CSS property with a value of content-height (or content-width) on the iframe. The document loaded in the <iframe> (e.g. iframe.html) needs to include a meta tag to indicate that it’s OK to communicate its size the parent embedder. In code: /* In styles.css for index.html */ iframe { frame-sizing: content-height; width: 100%; } <!-- In the iframe.html’s head --> <meta name="responsive-embedded-sizing" content="allow-origins=*"> The content’s size is communicated from the embedded document after page load. To communicate a new size, the document in the frame must call…