Intrinsic & Extrinsic Sizing
Intrinsic & Extrinsic Sizing
Allows for the heights and widths to be specified in intrinsic values using the max-content, min-content, fit-content and stretch (formerly fill) properties.
| Spec | http://www.w3.org/TR/css3-sizing/ |
|---|---|
| Status | W3C Working Draft |
| IE | Edge | Firefox | Chrome | Safari | Opera |
|---|---|---|---|---|---|
| 57 (1,2,3,*) | 62 (3,4) | ||||
| 56 (1,2,3,*) | 61 (3,4) | TP (3) | 48 (3,4) | ||
| 16 | 55 (1,2,3,*) | 60 (3,4) | 11 (3) | 47 (3,4) | |
| 11 | 15 | 54 (1,2,3,*) | 59 (3,4) | 10.1 (3,*) | 46 (3,4) |
| 10 | 14 | 53 (1,2,3,*) | 58 (3,4) | 10 (3,*) | 45 (3,4) |
| 9 | 13 | 52 (1,2,3,*) | 57 (3,4) | 9.1 (3,*) | 44 (3,4) |
| 8 | 12 | 51 (1,2,3,*) | 56 (3,4) | 9 (3,*) | 43 (3,4) |
| Show all | |||||
| 7 | 50 (1,2,3,*) | 55 (3,4) | 8 (1,3,*) | 42 (3,4) | |
| 6 | 49 (1,2,3,*) | 54 (3,4) | 7.1 (1,3,*) | 41 (3,4) | |
| 5.5 | 48 (1,2,3,*) | 53 (3,4) | 7 (1,3,*) | 40 (3,4) | |
| 47 (1,2,3,*) | 52 (3,4) | 6.1 (1,3,*) | 39 (3,4) | ||
| 46 (1,2,3,*) | 51 (3,4) | 6 | 38 (3,4) | ||
| 45 (1,2,3,*) | 50 (3,4) | 5.1 | 37 (3,4) | ||
| 44 (1,2,3,*) | 49 (3,4) | 5 | 36 (3,4) | ||
| 43 (1,2,3,*) | 48 (3,4) | 4 | 35 (3,4) | ||
| 42 (1,2,3,*) | 47 (3,4) | 3.2 | 34 (3) | ||
| 41 (1,2,3,*) | 46 (3,4) | 3.1 | 33 (3,4) | ||
| 40 (1,2,3,*) | 45 (3,*) | 32 (3,*) | |||
| 39 (1,2,3,*) | 44 (3,*) | 31 (3,*) | |||
| 38 (1,2,3,*) | 43 (3,*) | 30 (3,*) | |||
| 37 (1,2,3,*) | 42 (3,*) | 29 (3,*) | |||
| 36 (1,2,3,*) | 41 (3,*) | 28 (3,*) | |||
| 35 (1,2,3,*) | 40 (3,*) | 27 (3,*) | |||
| 34 (1,2,3,*) | 39 (3,*) | 26 (3,*) | |||
| 33 (1,2,3,*) | 38 (3,*) | 25 (3,*) | |||
| 32 (1,2,3,*) | 37 (3,*) | 24 (3,*) | |||
| 31 (1,2,3,*) | 36 (3,*) | 23 (3,*) | |||
| 30 (1,2,3,*) | 35 (3,*) | 22 (3,*) | |||
| 29 (1,2,3,*) | 34 (3,*) | 21 (3,*) | |||
| 28 (1,2,3,*) | 33 (3,*) | 20 (3,*) | |||
| 27 (1,2,3,*) | 32 (3,*) | 19 (3,*) | |||
| 26 (1,2,3,*) | 31 (3,*) | 18 (3,*) | |||
| 25 (1,2,3,*) | 30 (3,*) | 17 (3,*) | |||
| 24 (1,2,3,*) | 29 (3,*) | 16 (3,*) | |||
| 23 (1,2,3,*) | 28 (3,*) | 15 (3,*) | |||
| 22 (1,2,3,*) | 27 (3,*) | 12.1 | |||
| 21 (1,2,3,*) | 26 (3,*) | 12 | |||
| 20 (1,2,3,*) | 25 (3,*) | 11.6 | |||
| 19 (1,2,3,*) | 24 (3,*) | 11.5 | |||
| 18 (1,2,3,*) | 23 (3,*) | 11.1 | |||
| 17 (1,2,3,*) | 22 (3,*) | 11 | |||
| 16 (1,2,3,*) | 21 | 10.6 | |||
| 15 (1,2,3,*) | 20 | 10.5 | |||
| 14 (1,2,3,*) | 19 | 10.0-10.1 | |||
| 13 (1,2,3,*) | 18 | 9.5-9.6 | |||
| 12 (1,2,3,*) | 17 | 9 | |||
| 11 (1,2,3,*) | 16 | ||||
| 10 (1,2,3,*) | 15 | ||||
| 9 (1,2,3,*) | 14 | ||||
| 8 (1,2,3,*) | 13 | ||||
| 7 (1,2,3,*) | 12 | ||||
| 6 (1,2,3,*) | 11 | ||||
| 5 (1,2,3,*) | 10 | ||||
| 4 (1,2,3,*) | 9 | ||||
| 3.6 (1,2,3,*) | 8 | ||||
| 3.5 (1,2,3,*) | 7 | ||||
| 3 (1,2,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 (3,*) | |||||||||||
| 10.3 (3,*) | all | 56 (3,4) | 10 (3,*) | 37 (3,4) | 59 (3,4) | 54 (1,2,3,*) | 11 | 11.4 (3,*) | 5 (3,4) | 1.2 (3,*) | 7.12 (3,4) |
| 10.0-10.2 (3,*) | 4.4.3-4.4.4 (3,*) | 7 | 12.1 | 10 | 4 (3,*) | ||||||
| 9.3 (3,*) | 4.4 (3,*) | 12 | |||||||||
| 9.0-9.2 (3,*) | 4.2-4.3 | 11.5 | |||||||||
| Show all | |||||||||||
| 8.1-8.4 (1,3,*) | 4.1 | 11.1 | |||||||||
| 8 (1,3,*) | 4 | 11 | |||||||||
| 7.0-7.1 (1,3,*) | 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
Prefixes are on the values, not the property names (e.g. -webkit-min-content)
Older webkit browsers also support the unofficial intrinsic value which acts the same as max-content.
Does not support for height/min-height/max-height property, only width. see test case Firefox bug
Firefox currently supports the "-moz-available" property rather than "-moz-stretch".
Does not support for "flex-basis" property. see specs.
Blink bug,Firefox bugThis does not yet unprefix
stretch(aka fill/fill-available)See bug, because the CSSWG is not ready for that yet.
- * Partial support with prefix.
Resources
Data by caniuse.com
Licensed under the Creative Commons Attribution License v4.0.
http://caniuse.com/#feat=intrinsic-width
