Using strictMath

Using strictMath to prevent Less from trying to calculate stuff it's shouldn't calculate.

Example:
The following Less:
.small {
  width: calc(~"100% / 12 * 6 - 40px");
}
will output the following CSS:
.small {
  width: -webkit-calc(100% / 12 * 7 - 40px);
  width: calc(100% / 12 * 7 - 40px);
}
which is as expected. The calculation can be performed at runtime.

But the minified version will be:
.small{width:-webkit-calc(18.33333333%);width:calc(18.33333333%)}
and that's something else (the absolute part, 40px, shouldn't be converted to something relative).

By using strictMath: true both the CSS and the minified CSS will contain the entire calculation.

1 files changed, 2 insertions, 1 deletions

diff --git a/Gruntfile.js b/Gruntfile.js
index 247d3c40..c21bfeb6 100644
--- a/Gruntfile.js
+++ b/Gruntfile.js
@@ -45,7 +45,8 @@ module.exports = function (grunt) {
     less: {
       dist: {
         options: {
-          compress: false
+          compress: false,
+          strictMath: true
         },
         files: {}
       }