<length-percentage>

The <length-percentage> CSS data type represents a value that can be either a length or a percentage.
The <length-percentage> CSS数据类型表示一个值，该值可以是<length>或<percentage>。

Syntax

Refer to the documentation for length and percentage for details of the individual syntaxes allowed by this type.

Use in `calc()`

Where a <length-percentage> is specified as an allowable type, this means that the percentage resolves to a length and therefore can be used in a calc() expression. Therefore, all of the following values are acceptable for width:

width: 200px;
width: 20%;
width: calc(100% - 200px);

Specifications

Specification	Status	Comment
CSS Values and Units Module Level 4 <length-percentage>	Editor's Draft
CSS Values and Units Module Level 3 <length-percentage>	Candidate Recommendation	Defines `<length-percentage>`. Adds `calc()`

Browser compatibility

Update compatibility data on GitHub

	Desktop						Mobile
	Chrome	Edge	Firefox	Internet Explorer	Opera	Safari	Android webview	Chrome for Android	Firefox for Android	Opera for Android	Safari on iOS	Samsung Internet
`<length-percentage>`	Chrome Full support 1	Edge Full support 12	Firefox Full support 1	IE Full support 3	Opera Full support 3.5	Safari Full support 1	WebView Android Full support ≤37	Chrome Android Full support 18	Firefox Android Full support 4	Opera Android Full support 10.1	Safari iOS Full support 1	Samsung Internet Android Full support 1.0
`Q` unit	Chrome Full support 63	Edge No support No	Firefox Full support 49	IE No support No	Opera Full support 50	Safari No support No	WebView Android Full support 63	Chrome Android Full support 63	Firefox Android Full support 49	Opera Android Full support 46	Safari iOS No support No	Samsung Internet Android Full support 8.0
`cap` unit	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
`ch` unit	Chrome Full support 27	Edge Full support 12	Firefox Full support 1 Notes Full support 1 Notes Notes From Firefox 1 to Firefox 3, `ch` was the width of the M character. Notes From Firefox 1 to Firefox 3, `ch` did not work with `border-width` and `outline-width` CSS properties.	IE Full support 9	Opera Full support 20	Safari Full support 7	WebView Android Full support ≤37	Chrome Android Full support 27	Firefox Android Full support 4	Opera Android Full support Yes	Safari iOS Full support 7	Samsung Internet Android Full support 1.5
`ex` unit	Chrome Full support 1	Edge Full support 12	Firefox Full support 1	IE Full support 4	Opera Full support 3.5	Safari Full support 1	WebView Android Full support 1	Chrome Android Full support 18	Firefox Android Full support 4	Opera Android Full support 10.1	Safari iOS Full support 1	Samsung Internet Android Full support 1.0
`ic` unit	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
`lh` unit	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
`mozmm` unit Non-standard	Chrome No support No	Edge No support No	Firefox No support 4 — 59	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 4 — 59	Opera Android No support No	Safari iOS No support No	Samsung Internet Android No support No
`rem` unit	Chrome Full support 4	Edge Full support 12	Firefox Full support 3.6	IE Full support 9	Opera Full support 11.6	Safari Full support 4.1	WebView Android Full support 2	Chrome Android Full support 18	Firefox Android Full support 4	Opera Android Full support 12	Safari iOS Full support 4	Samsung Internet Android Full support 1.0
`rlh` unit	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
`vb` unit	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
`vh` unit	Chrome Full support 20	Edge Full support 12	Firefox Full support 19	IE Full support 9	Opera Full support 20	Safari Full support 6	WebView Android Full support ≤37	Chrome Android Full support 25	Firefox Android Full support 19	Opera Android Full support Yes	Safari iOS Full support 6	Samsung Internet Android Full support 1.5
`vi` unit	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
`vmax` unit	Chrome Full support 26	Edge Full support 16	Firefox Full support 19 Notes Full support 19 Notes Notes Starting with version 21, viewport-percentage lengths are invalid in `@page`.	IE No support No	Opera Full support 15	Safari Full support 6.1	WebView Android Full support 1.5	Chrome Android Full support 26	Firefox Android Full support 19 Notes Full support 19 Notes Notes Starting with version 21, viewport-percentage lengths are invalid in `@page`.	Opera Android Full support 14	Safari iOS Full support 6.1	Samsung Internet Android Full support 1.5
`vmin` unit	Chrome Full support 26	Edge Full support 12 Full support 12 Full support 12 Alternate Name Alternate Name Uses the non-standard name: `vm`	Firefox Full support 19 Notes Full support 19 Notes Notes Starting with version 21, viewport-percentage lengths are invalid in `@page`.	IE Full support 10 Full support 10 Full support 9 Alternate Name Alternate Name Uses the non-standard name: `vm`	Opera Full support 15	Safari Full support 6.1	WebView Android Full support ≤37	Chrome Android Full support 26	Firefox Android Full support 19 Notes Full support 19 Notes Notes Starting with version 21, viewport-percentage lengths are invalid in `@page`.	Opera Android Full support 14	Safari iOS Full support 6.1	Samsung Internet Android Full support 1.5
`vw` unit	Chrome Full support 20	Edge Full support 12	Firefox Full support 19 Notes Full support 19 Notes Notes Starting with version 21, viewport-percentage lengths are invalid in `@page`.	IE Full support 9	Opera Full support 20	Safari Full support 6	WebView Android Full support ≤37	Chrome Android Full support 25	Firefox Android Full support 19 Notes Full support 19 Notes Notes Starting with version 21, viewport-percentage lengths are invalid in `@page`.	Opera Android Full support Yes	Safari iOS Full support 6	Samsung Internet Android Full support 1.5

Legend

Full support: Full support
No support: No support
Non-standard. Expect poor cross-browser support.: Non-standard. Expect poor cross-browser support.
See implementation notes.: See implementation notes.
Uses a non-standard name.: Uses a non-standard name.