height

The height CSS descriptor is a shorthand descriptor for setting both min-height and max-height of the viewport. By providing one viewport length value will set both, the minimum height and the maximum height, to the value provided.

If two viewport values are provided, the first value will set the minimum height and the second value will set the maximum height.

Syntax

/* One value */
height: auto;
height: 320px;
height: 15em;

/* Two values */
height: 320px 200px;

Values

auto
The used value is calculated from the other CSS descriptors' values.
<length>
A non-negative absolute or relative length.
<percentage>
A percentage value relative to the width or height of the initial viewport at zoom factor 1.0, for horizontal and vertical lengths respectively. Must be non-negative.

Formal definition

Related at-rule@viewport
Initial valueas each of the properties of the shorthand:
Percentagesas each of the properties of the shorthand:
  • min-height: The percentage is calculated with respect to the height of the generated box's containing block. If the height of the containing block is not specified explicitly (i.e., it depends on content height), and this element is not absolutely positioned, the percentage value is treated as 0.
  • max-height: The percentage is calculated with respect to the height of the generated box's containing block. If the height of the containing block is not specified explicitly (i.e., it depends on content height), and this element is not absolutely positioned, the percentage value is treated as none.
Computed valueas each of the properties of the shorthand:
  • min-height: the percentage as specified or the absolute length
  • max-height: the percentage as specified or the absolute length or none

Formal syntax

<viewport-length>{1,2}

where
<viewport-length> = auto | <length-percentage>

where
<length-percentage> = <length> | <percentage>

Examples

Setting minimum and maximum height

@viewport {
  height: 500px;
}

Specifications

Specification Status Comment
CSS Device Adaptation
The definition of '"height" descriptor' in that specification.
Working Draft Initial definition

Browser compatibility

Update compatibility data on GitHub
DesktopMobile
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome for AndroidFirefox for AndroidOpera for AndroidSafari on iOSSamsung Internet
height descriptorChrome No support 29 — 84Edge Full support 12
Prefixed
Full support 12
Prefixed
Prefixed Implemented with the vendor prefix: -ms-
Firefox No support NoIE Full support 10
Prefixed
Full support 10
Prefixed
Prefixed Implemented with the vendor prefix: -ms-
Opera Full support 16
Full support 16
No support 11.1 — 15
Safari No support NoWebView Android No support 4.4 — 37Chrome Android No support 29 — 84Firefox Android No support NoOpera Android Full support 16
Full support 16
No support 11.1 — 14
Safari iOS No support NoSamsung Internet Android Full support 2.0

Legend

Full support  
Full support
No support  
No support
Requires a vendor prefix or different name for use.
Requires a vendor prefix or different name for use.

See also