CSS Logical Properties
Logical properties and values provide control of layout through logical, rather than physical, direction and dimension mappings. These properties are `writing-mode` relative equivalents of their corresponding physical properties.
W3C Working Draft: https://www.w3.org/TR/css-logical-1/
Usage: 94.7% + 1.71% = 96.4%
Support summary
- IE: Not supported
- Edge: 89, partial since 79, notes for version 793, notes for version 874
- Firefox: 66, partial since 3, prefixed since 3, notes for version 31, notes for version 413
- Chrome: 89, partial since 4, prefixed since 4, notes for version 42, notes for version 693, notes for version 874
- Safari: 15, partial since 3.1, prefixed since 3.1, notes for version 3.12, notes for version 12.13, notes for version 14.14
- Opera: 76, partial since 15, prefixed since 15, notes for version 152, notes for version 563, notes for version 744
- Safari on iOS: 15.0-15.1, partial since 3.2, prefixed since 3.2, notes for version 3.22, notes for version 12.2-12.53, notes for version 14.5-14.84
- Opera Mini: Not supported
- Android Browser: 136, partial since 2.1, prefixed since 2.1, notes for version 2.12
- Blackberry Browser: partial since 7, prefixed since 7, notes for version 72
- Opera Mobile: 80
- Chrome for Android: 136
- Firefox for Android: 137
- IE Mobile: Not supported
- UC Browser for Android: 15.5
- Samsung Internet: 15.0, partial since 4, prefixed since 4, notes for version 42, notes for version 10.13
- QQ Browser: partial since 14.9, notes for version 14.93
- Baidu Browser: 13.52
- KaiOS Browser: 3.0-3.1, partial since 2.5, notes for version 2.53
Notes
- Only supports the `*-start`, and `*-end` values for `margin`, `border` and `padding`, not the `inline`/`block` type values as defined in the spec.
↑
- Like #1 but also supports `*-before` and `*-end` for `*-block-start` and `*-block-end` properties as well as `start` and `end` values for `text-align`.
↑
- Does not support the `margin-block`, `margin-inline`, `padding-block`, `padding-inline`, or any of the `inset` shorthand properties. Supported in newer Chromium browsers behind the `#enable-experimental-web-platform-features` flag.
↑
- Does not support the `border-start-start-radius`, `border-start-end-radius`, `border-end-start-radius` and `border-end-end-radius` property.
↑
- Does not support the `margin-block`, `margin-inline`, `padding-block`, `padding-inline` shorthand properties when value is a CSS property. Supported when using a length value.
↑
Links
Full support table
IE
Edge
| 12 | 13 | 14 | 15 | 16 | 17 | 18 | 79 | 80 | 81 | 83 | 84 | 85 | 86 | 87 | 88 | 89 | 90 | 91 | 92 | 93 | 94 | 95 | 96 | 97 | 98 | 99 | 100 | 101 | 102 | 103 | 104 | 105 | 106 | 107 | 108 | 109 | 110 | 111 | 112 | 113 | 114 | 115 | 116 | 117 | 118 | 119 | 120 | 121 | 122 | 123 | 124 | 125 | 126 | 127 | 128 | 129 | 130 | 131 | 132 | 133 | 134 | 135 | 136 |
|---|
| n | n | n | n | n | n | n | a | a | a | a | a | a | a | a | a | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y |
Firefox
| 2 | 3 | 3.5 | 3.6 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | 42 | 43 | 44 | 45 | 46 | 47 | 48 | 49 | 50 | 51 | 52 | 53 | 54 | 55 | 56 | 57 | 58 | 59 | 60 | 61 | 62 | 63 | 64 | 65 | 66 | 67 | 68 | 69 | 70 | 71 | 72 | 73 | 74 | 75 | 76 | 77 | 78 | 79 | 80 | 81 | 82 | 83 | 84 | 85 | 86 | 87 | 88 | 89 | 90 | 91 | 92 | 93 | 94 | 95 | 96 | 97 | 98 | 99 | 100 | 101 | 102 | 103 | 104 | 105 | 106 | 107 | 108 | 109 | 110 | 111 | 112 | 113 | 114 | 115 | 116 | 117 | 118 | 119 | 120 | 121 | 122 | 123 | 124 | 125 | 126 | 127 | 128 | 129 | 130 | 131 | 132 | 133 | 134 | 135 | 136 | 137 | 138 | 139 | 140 | 141 |
|---|
| n | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a | a | a | a | a | a | a | a | a | a | a | a | a | a | a | a | a | a | a | a | a | a | a | a | a | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y |
Chrome
| 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | 42 | 43 | 44 | 45 | 46 | 47 | 48 | 49 | 50 | 51 | 52 | 53 | 54 | 55 | 56 | 57 | 58 | 59 | 60 | 61 | 62 | 63 | 64 | 65 | 66 | 67 | 68 | 69 | 70 | 71 | 72 | 73 | 74 | 75 | 76 | 77 | 78 | 79 | 80 | 81 | 83 | 84 | 85 | 86 | 87 | 88 | 89 | 90 | 91 | 92 | 93 | 94 | 95 | 96 | 97 | 98 | 99 | 100 | 101 | 102 | 103 | 104 | 105 | 106 | 107 | 108 | 109 | 110 | 111 | 112 | 113 | 114 | 115 | 116 | 117 | 118 | 119 | 120 | 121 | 122 | 123 | 124 | 125 | 126 | 127 | 128 | 129 | 130 | 131 | 132 | 133 | 134 | 135 | 136 | 137 | 138 | 139 |
|---|
| a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a | a | a | a | a | a | a | a | a | a | a | a | a | a | a | a | a | a | a | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y |
Safari
| 3.1 | 3.2 | 4 | 5 | 5.1 | 6 | 6.1 | 7 | 7.1 | 8 | 9 | 9.1 | 10 | 10.1 | 11 | 11.1 | 12 | 12.1 | 13 | 13.1 | 14 | 14.1 | 15 | 15.1 | 15.2-15.3 | 15.4 | 15.5 | 15.6 | 16.0 | 16.1 | 16.2 | 16.3 | 16.4 | 16.5 | 16.6 | 17.0 | 17.1 | 17.2 | 17.3 | 17.4 | 17.5 | 17.6 | 18.0 | 18.1 | 18.2 | 18.3 | 18.4 | 18.5 | TP |
|---|
| a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a | a | a | a | a | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y |
Opera
| 9 | 9.5-9.6 | 10.0-10.1 | 10.5 | 10.6 | 11 | 11.1 | 11.5 | 11.6 | 12 | 12.1 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | 42 | 43 | 44 | 45 | 46 | 47 | 48 | 49 | 50 | 51 | 52 | 53 | 54 | 55 | 56 | 57 | 58 | 60 | 62 | 63 | 64 | 65 | 66 | 67 | 68 | 69 | 70 | 71 | 72 | 73 | 74 | 75 | 76 | 77 | 78 | 79 | 80 | 81 | 82 | 83 | 84 | 85 | 86 | 87 | 88 | 89 | 90 | 91 | 92 | 93 | 94 | 95 | 96 | 97 | 98 | 99 | 100 | 101 | 102 | 103 | 104 | 105 | 106 | 107 | 108 | 109 | 110 | 111 | 112 | 113 | 114 | 115 | 116 | 117 |
|---|
| n | n | n | n | n | n | n | n | n | n | n | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a | a | a | a | a | a | a | a | a | a | a | a | a | a | a | a | a | a | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y |
Safari on iOS
| 3.2 | 4.0-4.1 | 4.2-4.3 | 5.0-5.1 | 6.0-6.1 | 7.0-7.1 | 8 | 8.1-8.4 | 9.0-9.2 | 9.3 | 10.0-10.2 | 10.3 | 11.0-11.2 | 11.3-11.4 | 12.0-12.1 | 12.2-12.5 | 13.0-13.1 | 13.2 | 13.3 | 13.4-13.7 | 14.0-14.4 | 14.5-14.8 | 15.0-15.1 | 15.2-15.3 | 15.4 | 15.5 | 15.6-15.8 | 16.0 | 16.1 | 16.2 | 16.3 | 16.4 | 16.5 | 16.6-16.7 | 17.0 | 17.1 | 17.2 | 17.3 | 17.4 | 17.5 | 17.6-17.7 | 18.0 | 18.1 | 18.2 | 18.3 | 18.4 | 18.5 |
|---|
| a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a | a | a | a | a | a | a | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y | y |
Opera Mini
Android Browser
| 2.1 | 2.2 | 2.3 | 3 | 4 | 4.1 | 4.2-4.3 | 4.4 | 4.4.3-4.4.4 | 136 |
|---|
| a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | a,x | y |
Blackberry Browser
Opera Mobile
| 10 | 11 | 11.1 | 11.5 | 12 | 12.1 | 80 |
|---|
| n | n | n | n | n | n | y |
Chrome for Android
Firefox for Android
IE Mobile
UC Browser for Android
Samsung Internet
| 4 | 5.0-5.4 | 6.2-6.4 | 7.2-7.4 | 8.2 | 9.2 | 10.1 | 11.1-11.2 | 12.0 | 13.0 | 14.0 | 15.0 | 16.0 | 17.0 | 18.0 | 19.0 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 |
|---|
| a,x | a,x | a,x | a,x | a,x | a,x | a | a | a | a | a | y | y | y | y | y | y | y | y | y | y | y | y | y |
QQ Browser
Baidu Browser
KaiOS Browser
- y = supported
- a = partially supported, see notes
- x = supported with a prefix, e.g. moz, webkit
- p = supported with a polyfill
- d = available but disabled by default; the feature need to be enabled in about:config, chrome://flags, etc.
- n = not supported
- u = unknown/untested
Back to list
Data copyright caniuse.com