CSS Math Functions

CSS Math Functions

The CSS math functions allow you to perform mathematical calculations to determine property values.

The most common math functions are:

• calc()
• max()
• min()

The calc() Function

The calc() function performs a calculation to be used as the property value.

The max() Function

The max() function uses the largest value, from a comma-separated list of values, as the property value.

The min() Function

The min() function uses the smallest value, from a comma-separated list of values, as the property value.

width: calc(100% - 100px);
width: max(50%, 300px);
width: min(50%, 300px);