This is an experimental technology
Check the Browser compatibility table carefully before using this in production.
The <frequency-percentage> CSS data type represents a value that can be either a <frequency> or a <percentage>. Frequency values, e.g. the pitch of a speaking voice, are not currently used in any CSS properties.
Syntax
The value of a <frequency-percentage> is either a <frequency> or a <percentage>; see their individual reference pages for details about their syntaxes.
Description
Use in calc()
Where a <frequency-percentage> is specified as an allowable type, this means that the percentage resolves to a frequency and therefore can be used in a calc() expression.
Examples
Valid percentage values
90% Positive percentage +90% Positive percentage with leading + -90% Negative percentage — not valid for all properties that use percentages
Invalid percentage values
90 % No space is allowed between the number and the unit
Valid frequency values
12Hz Positive integer 4.3Hz Non-integer 14KhZ The unit is case-insensitive, though non-SI capitalization is not recommended. +0Hz Zero, with a leading + and a unit -0kHz Zero, with a leading - and a unit
Invalid frequency values
12.0 This is a <number>, not an <frequency>, because it is missing a unit. 7 Hz No space is allowed between the number and the unit. 0 Although unitless zero is an allowable <length>, it's an invalid <frequency>.
Specifications
| Specification | Status | Comment |
|---|---|---|
| CSS Values and Units Module Level 4 The definition of '<frequency-percentage>' in that specification. |
Editor's Draft | |
| CSS Values and Units Module Level 3 The definition of '<frequency-percentage>' in that specification. |
Candidate Recommendation | Defines <frequency-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 | |||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|
<frequency-percentage> | Chrome No support No | Edge No support No | Firefox No support No | IE No support No | Opera No support No | Safari No support No | WebView Android No support No | Chrome Android No support No | Firefox Android No support No | Opera Android No support No | Safari iOS No support No | Samsung Internet Android No support No |
Legend
- No support
- No support
See also
- CSS data types
- CSS Values and Units
- Related CSS data types: