Want to save max() of time?
You know those little things you can spend tons of time on? Last week, I had one of those moments with a colleague. We spent too much time on it and then just accepted, “Okay, we didn’t know this.” But if I tell you, it might save you some time. We tried to do something like this.
div {
width: max(120vh - 271px, 0);
}This doesn’t work at all. Can you spot the error?
div {
width: max(120vh - 271px, 0px);
}It turns out that max() can’t calculate a value that has a unit alongside a unitless value. The browser then gets confused about the comparison. The same applies to the math functions calc(), min(), and clamp().
To save time, use units, folks!
