CSS overflow property
Originally a single property for controlling overflowing content in both horizontal & vertical directions, the overflow
property is now a shorthand for overflow-x
& overflow-y
. The latest version of the specification also introduces the clip
value that blocks programmatic scrolling.
Spec | https://www.w3.org/TR/css-overflow-3/ |
---|---|
Status | W3C Working Draft |
IE | Edge | Firefox | Chrome | Safari | Opera |
---|---|---|---|---|---|
98 | |||||
95 | 97 | ||||
94 | 96 | TP | |||
11 (1,2) | 95 | 93 | 95 | 15 (2) | 80 (2) |
10 (1,2) | 94 | 92 | 94 | 14.1 (2) | 79 (2) |
9 (1,2) | 93 | 91 | 93 | 14 (2) | 78 (2) |
8 (1,2) | 92 | 90 | 92 | 13.1 (2) | 77 (2) |
Show all | |||||
7 (1,2) | 91 | 89 | 91 | 13 (1,2) | 76 (2) |
6 (1,2) | 90 | 88 | 90 | 12.1 (1,2) | 75 (2) |
5.5 (1,2) | 89 (2) | 87 | 89 (2) | 12 (1,2) | 74 (2) |
88 (2) | 86 | 88 (2) | 11.1 (1,2) | 73 (2) | |
87 (2) | 85 | 87 (2) | 11 (1,2) | 72 (2) | |
86 (2) | 84 | 86 (2) | 10.1 (1,2) | 71 (2) | |
85 (2) | 83 | 85 (2) | 10 (1,2) | 70 (2) | |
84 (2) | 82 | 84 (2) | 9.1 (1,2) | 69 (2) | |
83 (2) | 81 | 83 (2) | 9 (1,2) | 68 (2) | |
81 (2) | 80 (2) | 81 (2) | 8 (1,2) | 67 (2) | |
80 (2) | 79 (2) | 80 (2) | 7.1 (1,2) | 66 (2) | |
79 (2) | 78 (2) | 79 (2) | 7 (1,2) | 65 (2) | |
18 (1,2) | 77 (2) | 78 (2) | 6.1 (1,2) | 64 (2) | |
17 (1,2) | 76 (2) | 77 (2) | 6 (1,2) | 63 (2) | |
16 (1,2) | 75 (2) | 76 (2) | 5.1 (1,2) | 62 (2) | |
15 (1,2) | 74 (2) | 75 (2) | 5 (1,2) | 60 (2) | |
14 (1,2) | 73 (2) | 74 (2) | 4 (1,2) | 58 (2) | |
13 (1,2) | 72 (2) | 73 (2) | 3.2 (1,2) | 57 (2) | |
12 (1,2) | 71 (2) | 72 (2) | 3.1 (1,2) | 56 (2) | |
70 (2) | 71 (2) | 55 (2) | |||
69 (2) | 70 (2) | 54 (1,2) | |||
68 (2) | 69 (2) | 53 (1,2) | |||
67 (2) | 68 (2) | 52 (1,2) | |||
66 (2) | 67 (1,2) | 51 (1,2) | |||
65 (2) | 66 (1,2) | 50 (1,2) | |||
64 (2) | 65 (1,2) | 49 (1,2) | |||
63 (2) | 64 (1,2) | 48 (1,2) | |||
62 (2) | 63 (1,2) | 47 (1,2) | |||
61 (2) | 62 (1,2) | 46 (1,2) | |||
60 (1,2) | 61 (1,2) | 45 (1,2) | |||
59 (1,2) | 60 (1,2) | 44 (1,2) | |||
58 (1,2) | 59 (1,2) | 43 (1,2) | |||
57 (1,2) | 58 (1,2) | 42 (1,2) | |||
56 (1,2) | 57 (1,2) | 41 (1,2) | |||
55 (1,2) | 56 (1,2) | 40 (1,2) | |||
54 (1,2) | 55 (1,2) | 39 (1,2) | |||
53 (1,2) | 54 (1,2) | 38 (1,2) | |||
52 (1,2) | 53 (1,2) | 37 (1,2) | |||
51 (1,2) | 52 (1,2) | 36 (1,2) | |||
50 (1,2) | 51 (1,2) | 35 (1,2) | |||
49 (1,2) | 50 (1,2) | 34 (1,2) | |||
48 (1,2) | 49 (1,2) | 33 (1,2) | |||
47 (1,2) | 48 (1,2) | 32 (1,2) | |||
46 (1,2) | 47 (1,2) | 31 (1,2) | |||
45 (1,2) | 46 (1,2) | 30 (1,2) | |||
44 (1,2) | 45 (1,2) | 29 (1,2) | |||
43 (1,2) | 44 (1,2) | 28 (1,2) | |||
42 (1,2) | 43 (1,2) | 27 (1,2) | |||
41 (1,2) | 42 (1,2) | 26 (1,2) | |||
40 (1,2) | 41 (1,2) | 25 (1,2) | |||
39 (1,2) | 40 (1,2) | 24 (1,2) | |||
38 (1,2) | 39 (1,2) | 23 (1,2) | |||
37 (1,2) | 38 (1,2) | 22 (1,2) | |||
36 (1,2) | 37 (1,2) | 21 (1,2) | |||
35 (1,2) | 36 (1,2) | 20 (1,2) | |||
34 (1,2) | 35 (1,2) | 19 (1,2) | |||
33 (1,2) | 34 (1,2) | 18 (1,2) | |||
32 (1,2) | 33 (1,2) | 17 (1,2) | |||
31 (1,2) | 32 (1,2) | 16 (1,2) | |||
30 (1,2) | 31 (1,2) | 15 (1,2) | |||
29 (1,2) | 30 (1,2) | 12.1 (1,2) | |||
28 (1,2) | 29 (1,2) | 12 (1,2) | |||
27 (1,2) | 28 (1,2) | 11.6 (1,2) | |||
26 (1,2) | 27 (1,2) | 11.5 (1,2) | |||
25 (1,2) | 26 (1,2) | 11.1 (1,2) | |||
24 (1,2) | 25 (1,2) | 11 (1,2) | |||
23 (1,2) | 24 (1,2) | 10.6 (1,2) | |||
22 (1,2) | 23 (1,2) | 10.5 (1,2) | |||
21 (1,2) | 22 (1,2) | 10.0-10.1 (1,2) | |||
20 (1,2) | 21 (1,2) | 9.5-9.6 (1,2) | |||
19 (1,2) | 20 (1,2) | 9 (1,2) | |||
18 (1,2) | 19 (1,2) | ||||
17 (1,2) | 18 (1,2) | ||||
16 (1,2) | 17 (1,2) | ||||
15 (1,2) | 16 (1,2) | ||||
14 (1,2) | 15 (1,2) | ||||
13 (1,2) | 14 (1,2) | ||||
12 (1,2) | 13 (1,2) | ||||
11 (1,2) | 12 (1,2) | ||||
10 (1,2) | 11 (1,2) | ||||
9 (1,2) | 10 (1,2) | ||||
8 (1,2) | 9 (1,2) | ||||
7 (1,2) | 8 (1,2) | ||||
6 (1,2) | 7 (1,2) | ||||
5 (1,2) | 6 (1,2) | ||||
4 (1,2) | 5 (1,2) | ||||
3.6 (1,2) | 4 (1,2) | ||||
3.5 (1,2) | |||||
3 (1,2) | |||||
2 (1,2) |
Safari on iOS | Opera Mini | Android Browser | Blackberry Browser | Opera Mobile | Android Chrome | Android Firefox | IE Mobile | Android UC Browser | Samsung Internet | QQ Browser | Baidu Browser | KaiOS Browser |
---|---|---|---|---|---|---|---|---|---|---|---|---|
15 (2) | all (1,2) | 94 | 10 (1,2) | 64 | 94 | 92 | 11 (1,2) | 12.12 (1,2) | 15.0 | 10.4 (1,2) | 7.12 (1,2) | 2.5 (1,2) |
14.5-14.8 (2) | 4.4.3-4.4.4 (1,2) | 7 (1,2) | 12.1 (1,2) | 10 (1,2) | 14.0 (1,2) | |||||||
14.0-14.4 (2) | 4.4 (1,2) | 12 (1,2) | 13.0 (1,2) | |||||||||
13.4-13.7 (2) | 4.2-4.3 (1,2) | 11.5 (1,2) | 12.0 (1,2) | |||||||||
Show all | ||||||||||||
13.3 (1,2) | 4.1 (1,2) | 11.1 (1,2) | 11.1-11.2 (1,2) | |||||||||
13.2 (1,2) | 4 (1,2) | 11 (1,2) | 10.1 (1,2) | |||||||||
13.0-13.1 (1,2) | 3 (1,2) | 10 (1,2) | 9.2 (1,2) | |||||||||
12.2-12.5 (1,2) | 2.3 (1,2) | 8.2 (1,2) | ||||||||||
12.0-12.1 (1,2) | 2.2 (1,2) | 7.2-7.4 (1,2) | ||||||||||
11.3-11.4 (1,2) | 2.1 (1,2) | 6.2-6.4 (1,2) | ||||||||||
11.0-11.2 (1,2) | 5.0-5.4 (1,2) | |||||||||||
10.3 (1,2) | 4 (1,2) | |||||||||||
10.0-10.2 (1,2) | ||||||||||||
9.3 (1,2) | ||||||||||||
9.0-9.2 (1,2) | ||||||||||||
8.1-8.4 (1,2) | ||||||||||||
8 (1,2) | ||||||||||||
7.0-7.1 (1,2) | ||||||||||||
6.0-6.1 (1,2) | ||||||||||||
5.0-5.1 (1,2) | ||||||||||||
4.2-4.3 (1,2) | ||||||||||||
4.0-4.1 (1,2) | ||||||||||||
3.2 (1,2) |
Notes
Effectively all browsers support the CSS 2.1 definition for single-value overflow
as well as overflow-x
& overflow-y
and values visible
, hidden
, scroll
& auto
Does not support the two value
overflow
shorthandDoes not support the
clip
value
Resources
- CSS overflow on MDN
- WebKit bug on support for two values syntax
- Edge bug on support for two values syntax
- WebKit bug on support for clip value
Data by caniuse.com
Licensed under the Creative Commons Attribution License v4.0.
https://caniuse.com/css-overflow