CSS Hyphenation
CSS Hyphenation
Method of controlling when words at the end of lines should be hyphenated using the "hyphens" property.
Spec | http://www.w3.org/TR/css3-text/#hyphenation |
---|---|
Status | W3C Working Draft |
IE | Edge | Firefox | Chrome | Safari | Opera |
---|---|---|---|---|---|
57 | 62 (1) | ||||
56 | 61 (1) | TP (*) | 48 (1) | ||
16 (*) | 55 | 60 (1) | 11 (*) | 47 (1) | |
11 (*) | 15 (*) | 54 | 59 (1) | 10.1 (*) | 46 (1) |
10 (*) | 14 (*) | 53 | 58 (1) | 10 (*) | 45 (1) |
9 | 13 (*) | 52 | 57 (1) | 9.1 (*) | 44 (1) |
8 | 12 (*) | 51 | 56 (1) | 9 (*) | 43 (1) |
Show all | |||||
7 | 50 | 55 (1) | 8 (*) | 42 (1) | |
6 | 49 | 54 | 7.1 (*) | 41 | |
5.5 | 48 | 53 | 7 (*) | 40 | |
47 | 52 | 6.1 (*) | 39 | ||
46 | 51 | 6 (*) | 38 | ||
45 | 50 | 5.1 (*) | 37 | ||
44 | 49 | 5 | 36 | ||
43 | 48 | 4 | 35 | ||
42 (*) | 47 | 3.2 | 34 | ||
41 (*) | 46 | 3.1 | 33 | ||
40 (*) | 45 | 32 | |||
39 (*) | 44 | 31 | |||
38 (*) | 43 | 30 | |||
37 (*) | 42 | 29 | |||
36 (*) | 41 | 28 | |||
35 (*) | 40 | 27 | |||
34 (*) | 39 | 26 | |||
33 (*) | 38 | 25 | |||
32 (*) | 37 | 24 | |||
31 (*) | 36 | 23 | |||
30 (*) | 35 | 22 | |||
29 (*) | 34 | 21 | |||
28 (*) | 33 | 20 | |||
27 (*) | 32 | 19 | |||
26 (*) | 31 | 18 | |||
25 (*) | 30 | 17 | |||
24 (*) | 29 | 16 | |||
23 (*) | 28 | 15 | |||
22 (*) | 27 | 12.1 | |||
21 (*) | 26 | 12 | |||
20 (*) | 25 | 11.6 | |||
19 (*) | 24 | 11.5 | |||
18 (*) | 23 | 11.1 | |||
17 (*) | 22 | 11 | |||
16 (*) | 21 | 10.6 | |||
15 (*) | 20 | 10.5 | |||
14 (*) | 19 | 10.0-10.1 | |||
13 (*) | 18 | 9.5-9.6 | |||
12 (*) | 17 | 9 | |||
11 (*) | 16 | ||||
10 (*) | 15 | ||||
9 (*) | 14 | ||||
8 (*) | 13 | ||||
7 (*) | 12 | ||||
6 (*) | 11 | ||||
5 | 10 | ||||
4 | 9 | ||||
3.6 | 8 | ||||
3.5 | 7 | ||||
3 | 6 | ||||
2 | 5 | ||||
4 |
iOS Safari | Opera Mini | Android Browser | Blackberry Browser | Opera Mobile | Android Chrome | Android Firefox | IE Mobile | Android UC Browser | Samsung Internet | QQ Browser | Baidu Browser |
---|---|---|---|---|---|---|---|---|---|---|---|
11 (*) | |||||||||||
10.3 (*) | all | 56 (1) | 10 | 37 | 59 (1) | 54 | 11 | 11.4 (*) | 5 (1) | 1.2 | 7.12 (1) |
10.0-10.2 (*) | 4.4.3-4.4.4 | 7 | 12.1 | 10 | 4 | ||||||
9.3 (*) | 4.4 | 12 | |||||||||
9.0-9.2 (*) | 4.2-4.3 | 11.5 | |||||||||
Show all | |||||||||||
8.1-8.4 (*) | 4.1 | 11.1 | |||||||||
8 (*) | 4 | 11 | |||||||||
7.0-7.1 (*) | 3 | 10 | |||||||||
6.0-6.1 (*) | 2.3 | ||||||||||
5.0-5.1 (*) | 2.2 | ||||||||||
4.2-4.3 (*) | 2.1 | ||||||||||
4.0-4.1 | |||||||||||
3.2 |
Notes
Chrome < 55 and Android 4.0 Browser support "-webkit-hyphens: none", but not the "auto" property. It is advisable to set the @lang attribute on the HTML element to enable hyphenation support and improve accessibility.
Only supported on Android & Mac platforms (and only the "auto" value) for now. see commit & related bug.
- * Partial support with prefix.
Resources
- Mozilla Developer Network (MDN) documentation - CSS hyphens
- Blog post
- WebPlatform Docs
- Chrome bug for implementing hyphenation
Data by caniuse.com
Licensed under the Creative Commons Attribution License v4.0.
http://caniuse.com/#feat=css-hyphens