CSS max-height Property


Example

Set the maximum height of a <p> element:

p {
    max-height: 50px;
}

Try it yourself »

Definition and Usage

The max-height property is used to set the maximum height of an element.

This prevents the value of the height property from becoming larger than max-height.

Note: The value of the max-height property overrides height

Default value: none
Inherited: no
Animatable: yes, see individual properties. Read about animatable Try it
Version: CSS2
JavaScript syntax: object.style.maxHeight="100px" Try it


Browser Support

The numbers in the table specify the first browser version that fully supports the property.

Property
max-height 1.0 7.0 1.0 2.0.2 7.0


CSS Syntax

max-height: none|length|initial|inherit;

Property Values

Value Description Play it
none No maximum height. This is default Play it »
length Defines the maximum height in px, cm, etc.  Play it »
% Defines the maximum height in percent of the containing block
initial Sets this property to its default value. Read about initial Play it »
inherit Inherits this property from its parent element. Read about inherit


Related Pages

CSS tutorial: CSS Dimension

CSS reference: min-height property

HTML DOM reference: maxHeight property



Color Picker

colorpicker