CSS max-width property

Description

CSS max-width specifies the maximum width of an element.

If the content overflows the width, it adds a scrollbar to the element.

Syntax

max-width : none | min-content | max-content | +ve length | +ver percentage | auto

Property values

noneDefault

No limit of width is applied to an element.

max-width: none;

min-content

min-content value specifies the largest minimum width of some descendant item.

max-width: min-content;

max-content

max-content value represents the largest maximum width of some descendant item.

max-width: max-content;

+ve length

30px value specifies the maximum width of the element.

max-width: 30px;

+ve percentage

30% means the width of current box can not exceed 30% of the parent box.

max-width: 30%;

auto

auto value means the width will be changed automatically according to the content.

max-width: auto;

Applicable to

It applies to all elements

#CSS digger
Was this article helpful?

 

This is the first child element.

This is the second child element.

×

Ctrl+D