Published: September 22, 2026
Chrome 154 is rolling out now, and this post shares some of the key features from the release. Read the full Chrome 154 release notes.
Highlights from this release:
- Responsively-sized
<iframe>lets an<iframe>size itself based on the intrinsic size of its embedded document. - CSS
scroll-marker-groupmodes addslinksandtabsmodes to configure the focus order and accessibility semantics of scroll markers. - CSS
text-decoration-insetlets you adjust the start and end points of text decorations.
Responsively-sized <iframe>
Chrome 154 adds support for responsively-sized iframes, letting an <iframe>
element in a parent document size itself to the embedded document's layout
overflow sizing so that scrolling in the child document is avoided. This replaces
the pattern where you manually measure iframe content, send dimensions with
postMessage(), and update the iframe size in the embedding page.
To size an iframe to its content height, use the frame-sizing CSS property on
the <iframe> element in the embedding page:
.embed {
width: 100%;
frame-sizing: content-height;
}
The embedded document must also opt in by including a
<meta name="responsive-embedded-sizing"> element in its <head>:
<meta name="responsive-embedded-sizing" content="allow-origins=*">
For more details and demos, see Responsive iframes in Chrome 154.
CSS scroll-marker-group modes
The scroll-marker-group
property controls whether a scroll container generates
a ::scroll-marker-group pseudo-element before or after its contents. Chrome 154
enhances scroll-marker-group with two modes that set the focus order and
WAI-ARIA accessibility semantics of ::scroll-marker-group and
::scroll-marker:
/* Links mode (default) */
scroll-marker-group: after links;
/* Tabs mode */
scroll-marker-group: before tabs;
CSS text-decoration-inset
By default, an element's text decoration (such as an underline, overline, or
line-through) is the same length as the rendered text. The
text-decoration-inset CSS property lets you adjust the start and end points of
an element's text decoration so that it is inset from, extended beyond, or
shifted relative to the text run edges.
text-decoration-inset accepts auto, length, and percentage values using
either one-value or two-value syntax, for example to inset both ends by 10px:
text-decoration-inset: 10px;
Positive values inset the decoration (making it shorter), while negative values outset the decoration (making it longer). This lets you fine-tune decoration spacing and create animated underline reveal effects with CSS text decorations instead of background gradients or extra elements.
For more information, see the
text-decoration-inset documentation on MDN.
Further reading
This covers only some key highlights. Check the following links for additional changes in Chrome 154:
Subscribe
To stay up to date, subscribe to the Chrome Developers YouTube channel, and you'll get an email notification whenever we launch a new video. Or follow us on X or LinkedIn for new articles and blog posts.
As soon as Chrome 155 is released, we'll be right here to tell you what's new in Chrome!