height

The height property designates an element’s height, which does not include borders, margin, or padding.

Syntax

If the height is set to auto the element’s height will automatically adjust to correctly display its contents. If height is specified with a numeric value and the content is larger than that value, it will overflow the container. How the overflowing content is handled is defined by the overflow property. Note that min-height and max-height will override the height property.

div.one {
  height: 100px;
}

div.two {
  height: auto;
}

Values

auto
Default value. Height is automatically calculated by the browser.

length
Designates the element’s height in px, cm, em, rem, etc.

%
Designates the element’s height as a percentage of its container.

initial
Sets the property to its default value.

inherit
Inherits this property’s value from its parent item.

Browser Compatibilty

Demos

Have a code example of height? Submit a codepen.io demo and we'll showcase it here ↴