The <angle-percentage> CSS data type represents a value that can be either a <angle> or a <percentage>.
Syntax
Refer to the documentation for <angle> and <percentage> for details of the individual syntaxes allowed by this type.
Use in calc()
Where an <angle-percentage> is specified as an allowable type, this means that the percentage resolves to an angle and therefore can be used in a calc() expression.
Specifications
| Specification | Status | Comment |
|---|---|---|
| CSS Values and Units Module Level 4 The definition of '<angle-percentage>' in that specification. |
Editor's Draft | |
| CSS Values and Units Module Level 3 The definition of '<angle-percentage>' in that specification. |
Candidate Recommendation | Defines <angle-percentage>. Adds calc() |
Browser compatibility
The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out https://github.com/mdn/browser-compat-data and send us a pull request.
Update compatibility data on GitHub
| Desktop | Mobile | ||||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
<angle-percentage> | Chrome Full support 2 | Edge Full support 12 | Firefox Full support 3.6 | IE Full support 9 | Opera Full support Yes | Safari Full support 4 | WebView Android Full support Yes | Chrome Android Full support Yes | Edge Mobile Full support Yes | Firefox Android Full support 4 | Opera Android Full support Yes | Safari iOS Full support Yes | Samsung Internet Android Full support Yes |
deg | Chrome Full support 2 | Edge Full support 12 | Firefox Full support 3.6 | IE Full support 9 | Opera Full support Yes | Safari Full support 4 | WebView Android Full support Yes | Chrome Android Full support Yes | Edge Mobile Full support Yes | Firefox Android Full support 4 | Opera Android Full support Yes | Safari iOS Full support Yes | Samsung Internet Android Full support Yes |
grad | Chrome Full support 2 | Edge Full support 12 | Firefox Full support 3.6 | IE Full support 9 | Opera Full support Yes | Safari Full support 4 | WebView Android Full support Yes | Chrome Android Full support Yes | Edge Mobile Full support Yes | Firefox Android Full support 4 | Opera Android Full support Yes | Safari iOS Full support Yes | Samsung Internet Android Full support Yes |
rad | Chrome Full support 2 | Edge Full support 12 | Firefox Full support 3.6 | IE Full support 9 | Opera Full support Yes | Safari Full support 4 | WebView Android Full support Yes | Chrome Android Full support Yes | Edge Mobile Full support Yes | Firefox Android Full support 4 | Opera Android Full support Yes | Safari iOS Full support Yes | Samsung Internet Android Full support Yes |
turn | Chrome Full support Yes | Edge Full support 12 | Firefox Full support 13 | IE Full support 9 | Opera Full support Yes | Safari Full support 10 | WebView Android Full support Yes | Chrome Android Full support Yes | Edge Mobile Full support Yes | Firefox Android Full support 14 | Opera Android Full support Yes | Safari iOS Full support 10 | Samsung Internet Android Full support Yes |
Legend
- Full support
- Full support