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
From web4college, the free CSS digger
#CSS digger
Was this article helpful?
This is the first child element.
This is the second child element.