@viewport.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

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

Browser compatibilityUpdate compatibility data on GitHub

See also

• @viewport