The min function
The min
function allows you to select
the minimum of passed values. The function
takes two or more values as parameters,
separated by commas, and returns the
minimum of them.
Syntax
selector {
property: min(value1, value2);
}
Example
Now the block width will be either
300px
or 50%
of the
parent, whichever is smaller:
<div id="parent">
<div id="child"></div>
</div>
#child {
width: min(300px, 50%);
height: 100px;
margin: 0 auto;
border: 1px solid red;
}
#parent {
border: 1px solid green;
}
: