Google has been rolling out Chrome 157 to a small portion of Windows users since October 28, and the Mac version is due to follow shortly after. Everyone else will get the update with the regular stable version, which Google is planning for November 3. For web designers, the release notes contain four new CSS features that you don't first have to unlock under chrome://flags.
What will Chrome show at the end of a truncated line in the future?
Until now, Chrome only knew two values for text-overflow: clip cuts the text off abruptly, ellipsis adds three dots. As of version 157, the property additionally accepts a custom string, such as text-overflow: " (more)";. The addition sits inside the box and shortens the visible text. If the box is even narrower than the addition, the browser truncates it too.
As before, the property only takes effect on text that actually overflows, usually together with overflow: hidden and white-space: nowrap.
What changes with corners and underlines?
With corner-shape, Chrome has since version 139 been shaping corners that are cut off diagonally (bevel), curved inward (scoop), notched at right angles (notch), or rounded as a squircle, i.e. a hybrid of a square and a circle. The shape only works together with a border-radius, so until now in two declarations. The new shorthand corner sets both at once, for example corner: scoop 24px;. You control individual corners with corner-top-left and the corresponding properties for the other three corners, and entire edges with corner-top, corner-bottom as well as logical variants such as corner-block-start.
The text-decoration-inset property determines how far underlines, overlines, and strikethroughs are inset from or extend beyond the start and end of the text. Allowed values are auto, lengths, and percentages, with one value for both sides or two values for start and end. Google cites effects in which an underline only becomes visible gradually as a use case; until now, something like that required a background gradient or an additional element.
For anchor positioning, Chrome renames two values. anchors-valid and anchors-visible of the position-visibility property become anchor-valid and anchor-visible following a decision by the CSS Working Group. The old names will continue to work for the time being, but are considered deprecated.
Which browsers already support the new values?
With the custom truncation text, Chrome is only catching up: Firefox has supported the value since version 9 from 2011. With corners, on the other hand, Chrome is ahead, because Firefox and Safari so far only offer corner-shape in their preview versions Nightly and Technology Preview.
CSS feature
Chrome
Firefox
Safari
text-overflow with custom text
from 157
since 9
in no released version
corner-shape
since 139
preview version only
preview version only
text-decoration-inset
from 157
since 146, without percentage values
preview version only
What this means for your stylesheets
You can use the custom truncation text right away, as long as the three dots come first as a fallback for older browsers: first text-overflow: ellipsis;, below it text-overflow: " (more)";. A browser that doesn't know the new value simply discards the second line. Safari users on Mac and iPhone will therefore continue to see the dots until Apple catches up.
A browser without the corner shorthand, on the other hand, discards the entire declaration, including the radius. It is therefore best to set border-radius as a separate line beforehand; Firefox and Safari will then show normally rounded corners instead of angular boxes.
If you already use position-visibility, it's best to search your stylesheet for anchors-valid and anchors-visible and replace both with the singular form. Which version your Chrome is can be found under Help › About Google Chrome. You can then check the new rendering in the developer tools, which the course on Chrome Developer Tools explains step by step.
Google announced the early rollout of Chrome 157 on October 28, 2026.
