CSS Display is a module of CSS that defines how the CSS formatting box tree is generated from the document element tree and defines properties controlling it.
display: block
, display: inline
)display: flex
display: grid
Specification | Status | Comment |
---|---|---|
CSS Display Module Level 3 The definition of 'display' in that specification. | Candidate Recommendation | Added run-in , flow , flow-root , contents and multi-keyword values. |
CSS Level 2 (Revision 1) The definition of 'display' in that specification. | Recommendation | Added the table model values and inline-block . |
CSS Level 1 The definition of 'display' in that specification. | Recommendation | Initial definition. Basic values: none , block , inline and list-item . |
In addition to the CSS Display Specification Level 3, further specifications define the behavior of various values of display.
Desktop | ||||||
---|---|---|---|---|---|---|
display |
1 | 12 | 1 | 4 | 7 | 1 |
contents |
65
|
79 | 37
|
No | 52
|
11.1 |
contents : Specific behavior of unusual elements when display: contents is applied to them |
58 | 79 | 59 | No | 45 | No |
<display-outside> |
1 | 12 | 1 | 4 | 7 | 1 |
display-outside.run-in
|
1 — 32
|
No | No | 8 | 7 — 19 | 1 — 8
|
flex |
29
|
12 | 20
|
11
|
16
|
9
|
flow-root |
58 | 79 | 53 | No | 45 | 13 |
grid |
57 | 16
|
52 | 10
|
44 | 10.1 |
inline-block |
1 | 12 | 1 | 8
|
7 | 1 |
inline-flex |
29
|
12 | 20
|
11
|
16
|
9
|
inline-grid |
57 | 16
|
52 | 10
|
44 | 10.1 |
inline-table |
1 | 12 | 3 | 8 | 7 | 1 |
list-item |
1 | 12 | 1 | 6 | 7 | 1 |
list-item : Supported on <legend>
|
71 | 79 | 64 | No | 58 | No |
Multi-keyword values | No | No | 70 | No | No | No |
none |
1
|
12 | 1 | 4 | 7
|
1 |
ruby , ruby-base , ruby-base-container , ruby-text , and ruby-text-container
|
No | 12 — 79 | 38
|
7 | No | No |
table , table-cell , table-column , table-column-group , table-footer-group , table-header-group , table-row , and table-row-group
|
1 | 12 | 1 | 8 | 7 | 1 |
-moz-box and -moz-inline-box
|
No | No | 1 — 64
|
No | No | No |
-moz-deck
|
No | No | 1 — 62
|
No | No | No |
-moz-grid , -moz-grid-group , and -moz-grid-line
|
No | No | 1 — 62
|
No | No | No |
-moz-inline-grid and -moz-inline-stack
|
No | No | 1 — 62
|
No | No | No |
-moz-popup
|
No | No | 1 — 62
|
No | No | No |
-moz-stack
|
No | No | 1 — 62
|
No | No | No |
Mobile | ||||||
---|---|---|---|---|---|---|
display |
≤37 | 18 | 4 | 10.1 | 1 | 1.0 |
contents |
65 | 65
|
57 | 47
|
11.3 | 9.0 |
contents : Specific behavior of unusual elements when display: contents is applied to them |
65 | 58 | 59 | 43 | No | 9.0 |
<display-outside> |
1 | 18 | 4 | 10.1 | 1 | 1.0 |
display-outside.run-in
|
≤37 — ≤37 | 18 — 32 | No | 10.1 — 19 | 1 — 8
|
1.0 — 2.0 |
flex |
4.4
|
29
|
20
|
16
|
9
|
2.0
|
flow-root |
58 | 58 | 53 | 43 | 13 | 7.0 |
grid |
57 | 57 | 52 | 43 | 10.3 | 6.0
|
inline-block |
≤37 | 18 | 4 | 14 | 1 | 1.0 |
inline-flex |
4.4
|
29
|
20
|
16
|
9
|
2.0
|
inline-grid |
57 | 57 | 52 | 43 | 10.3 | 6.0
|
inline-table |
≤37 | 18 | 4 | 14 | 1 | 1.0 |
list-item |
≤37 | 18 | 4 | 14 | 1 | 1.0 |
list-item : Supported on <legend>
|
71 | 71 | 64 | 50 | No | 10.0 |
Multi-keyword values | No | No | No | No | No | No |
none |
≤37
|
18
|
4 | 10.1
|
1 | 1.0
|
ruby , ruby-base , ruby-base-container , ruby-text , and ruby-text-container
|
No | No | 38
|
No | No | No |
table , table-cell , table-column , table-column-group , table-footer-group , table-header-group , table-row , and table-row-group
|
≤37 | 18 | 4 | 14 | 1 | 1.0 |
-moz-box and -moz-inline-box
|
No | No | 4 — 64
|
No | No | No |
-moz-deck
|
No | No | 4 — 62
|
No | No | No |
-moz-grid , -moz-grid-group , and -moz-grid-line
|
No | No | 4 — 62
|
No | No | No |
-moz-inline-grid and -moz-inline-stack
|
No | No | 4 — 62
|
No | No | No |
-moz-popup
|
No | No | 4 — 62
|
No | No | No |
-moz-stack
|
No | No | 4 — 62
|
No | No | No |
© 2005–2020 Mozilla and individual contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Display