The min-width and max-width properties are used to set the minimum and maximum width of an element.
The min-height and max-height properties are used to set the minimum and maximum height of an element.
CSS Using max-width
The max-width property sets the maximum allowed width of an element. This prevents the width of an element to be larger than the max-width property value.
The max-width property can have the following values:
- length - Defines the maximum width in px, cm, etc.
- % - Defines the maximum width in percent of the containing block
- none - This is default. Means that there is no maximum width
One problem with the width property can occur when the browser window is smaller than the width of the element. The browser then adds a horizontal scrollbar to the page. So, using max-width will improve the browser's handling on small windows.
All CSS Dimension Properties
| Property | Description |
|---|---|
| height | Sets the height of an element |
| max-height | Sets the maximum height of an element |
| max-width | Sets the maximum width of an element |
| min-height | Sets the minimum height of an element |
| min-width | Sets the minimum width of an element |
| width | Sets the width of an element |