The following display properties will no longer work when -webkit-box and -webkit-box-clamp are combined: -webkit-box-flex, -webkit-box-ordinal-group, -webkit-box-align, -webkit-box-pack, -webkit-box-direction.
Motivation
Internally this is implemented a LayoutDeprecatedFlexibleBox. In M80 we transparently mapped the "flex usecase" of -webkit-box over to LayoutFlexibleBox. E.g. anything except for: .line-clamp { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; } Is mapped over to flexbox implementation. We left the "line-clamp usecase" in LayoutDeprecatedFlexibleBox. This has suprising behaviour for web developers. 1) Other -webkit-box properties are supported, e.g: -webkit-box-flex -webkit-box-ordinal-group -webkit-box-align: -webkit-box-pack: -webkit-box-direction: We would stop these properties from having any affect in the "line-clamp usecase". NOTE these would still work for the "flex fallback" usecase. All these properties are below 0.0001% for M81 Beta. We would ship this removal first, as we believe that all these are extremely low (Google employees I can share internal UMA data) that these are all safe for removal. I've checked sites where they are using these properties with the "line-clamp usecase" and most have no effect. 2) As the "line-clamp usecase" was handled by a "flex" container, line-clamp was applied separately to all children, e.g. https://twitter.com/jaffathecake/status/1235869840226881536 https://jsbin.com/yerobes/edit?html,output In the above case web-developers expect that the line-clamp applies to the formatting context: https://twitter.com/bfgeek/status/1235982961331191813
Documentation
Specification
Specification being incubated in a Community Group
Status in Chromium
Deprecated
(tracking bug)
Consensus & Standardization
- No signal
- No signal
- Positive
Owners
Search tags
line-clamp,Last updated on 2021-12-13
Comments
-webkit-line-clamp is a highly used feature which all modern browsers support. Is is used for truncating multiline text, e.g. https://www.software.hixie.ch/utilities/js/live-dom-viewer/?saved=7810 Unfortunately this feature when developed, was built on "display: -webkit-box" feature which proceeded "display: flex". Practically speaking there are two separate uses for "display: -webkit-box": 1) Multi-line clamping. 2) Flex fallback. This intent discusses removing the flex features from -w-l-c.