CSS line-clamp
Proprietary and undocumented CSS property that will contain text to a given amount of lines when used in combination with display: -webkit-box
. It will end with ellipsis when text-overflow: ellipsis
is included.
IE | Edge | Firefox | Chrome | Safari | Opera | iOS Safari | Opera Mini | Android Browser | Blackberry Browser | Opera Mobile | Chrome for Android | Firefox for Android | IE Mobile | UC Browser for Android | Samsung Internet | QQ Browser | Baidu Browser |
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
49webkit |
|||||||||||||||||
56webkit |
9.3webkit |
4.4webkit |
|||||||||||||||
14 | 52 | 57webkit |
10webkit |
10.0-10.2webkit |
4.4.3-4.4.4webkit |
4webkit |
|||||||||||
11 | 15 | 53 | 58webkit |
10.1webkit |
44webkit |
10.3webkit |
all | 56webkit |
10webkit |
37o |
57webkit |
52 | 11 | 11.4webkit |
5webkit |
1.2webkit |
7.12webkit |
54 | 59webkit |
TPwebkit |
45webkit |
||||||||||||||
55 | 60webkit |
46webkit |
|||||||||||||||
56 | 61webkit |
Notes
As there is no specification and the property is dependent on an outdated implementation of flexbox (hence display: -webkit-box
) it is unlikely that other browsers will support the property as-is, although an alternative solution may at some point replace it.
Older (presto-based) versions of the Opera browser have also supported the same effect using the proprietary -o-ellipsis-lastline;
value for text-overflow
.