Don't compress '0px' in '0' with LESS/CSS minificator

Question

I would like to compress my LESS file where I use the new flexbox display like that :

flex: 1 1 0px;

I use grunt-contrib-less with the compress option active and the result is:

flex: 1 1 0;

It's work fine for Chrome and FF, but don't work in IE 11 when there is no 'px' after the 0.

Do you know a way to don't remove the 'px' or is it just a bug with my code and IE?

Answer 1

You could escape the value:

element {
  flex: ~"1 1 0px";
}

Since you are trying to escape a variable, you would use:

element {
  flex: ~"@{grow} @{shrink} @{basis}";
}