CSS max-width property

Definition and Usage

max-width defines the maximum width of the element.

Description

This property value sets a maximum limit on the width of the element. Therefore, the element can be narrower than the specified value, but not wider. Negative values are not allowed.

See Also:

CSS Tutorial:CSS Dimensions

CSS Reference Manual:CSS min-width property

HTML DOM Reference Manual:maxWidth Property

Example

Set the maximum width of the paragraph:

p
  {
  max-width:100px;
  }

Try It Yourself

CSS Syntax

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

Property Value

Value Description
none Default. Defines that there is no limit on the maximum width of the element.
length Defines the maximum width value of the element.
% Defines the percentage-based maximum width of the block-level object it contains.
inherit Specifies that the value of the max-width property should be inherited from the parent element.

Technical Details

Default Value: none
Inheritance: no
Version: CSS2
JavaScript Syntax: object.style.maxWidth="50px"

TIY Example

Set the maximum width of an element using pixel values
This example demonstrates how to set the maximum height of an element using pixel values.
Set the maximum width of an element using percentages
This example demonstrates how to set the maximum height of an element using percentage values.

Browser support

The numbers in the table indicate the first browser version that fully supports this attribute.

Chrome IE / Edge Firefox Safari Opera
1.0 7.0 1.0 1.0 7.0