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

> Source: <https://www.bram.us/2026/09/23/responsive-iframes/>
> Published: 2026-09-26 13:10:31+00:00

~

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>`.

~

### [#](#the-code) The Code

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`auto` ,`content-height` , or`content-width` (or its logical variants) 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%;
}
php
<!-- 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 `window.requestResize();`

Use `allow-origins` to limit which origins the document communicates its size info to.

~

### [#](#demo) Demo

Here’s a demo that contains a form which is an `<iframe>`. Whenever you go to a next step of the form, the `<iframe>` resizes itself to its contents … if your browser suppports `frame-sizing` that is.

Because the iframe resizes itself, the form is seamlessly embedded, without any scrollbar appearing at all.

~

### [#](#browser-support) Browser Support

💡 Although this post was originally published in September 2026, the list below is constantly being updated. *Last update: September 23, 2026*.

Support for responsively size iframes is this:

- Chromium *(Blink)*
- 
✅ Supported in Chrome 154
- Firefox *(Gecko)*
- 
❌ No Support. Follow [Bug 2035008](https://bugzilla.mozilla.org/show_bug.cgi?id=2035008) to stay up-to-date.
- Safari *(WebKit)*
- 
❌ No Support. Follow [Bug 314713](https://bugs.webkit.org/show_bug.cgi?id=314713) to stay up-to-date.

~

### [#](#learn-more) Learn More

Get all the details about responsive iframes on `developer.chrome.com`, in this article I co-authored: [Responsive iframes in Chrome 154 →](https://developer.chrome.com/blog/responsive-iframes)

~

**🔥 Like what you see? Want to stay in the loop? Here's how:**

I can also be found on [𝕏 Twitter](https://x.com/bramus) and [🐘 Mastodon](https://front-end.social/@bramus) but only post there sporadically.