2

I'm using Microsoft.AspNet.Web.Optimization (1.1.3) from an MVC 5.1 site to bundle and minify my CSS and it is replacing values of 0px with 0 in release mode and this causes rendering issues. Is it possible to stop this behavior somehow?

This css

min-width: -webkit-calc((240px + 0px + 550px + 0px + 240px + 0px));

Is replaced with:

min-width: -webkit-calc((240px + 0 + 550px + 0 + 240px + 0));

chrisp_68
  • 1,731
  • 23
  • 41
  • 1
    It would be a workaround, but do you really need to actually do a calculation that only involves constants? Can't you do that in advance, and document how that value was reached with a comment? – Linuxios Oct 21 '14 at 17:57
  • Thanks for the response, I am using singularitygs (vai SASS) as my grid system and that is adding this css so other than changing the grid system I cant change that easily. – chrisp_68 Oct 21 '14 at 19:04
  • 2
    `0%` is apparently allowed in `calc`, and your minifier will hopefully leave it alone, so if you can arrange to put out that instead of `0px` you might be in luck. –  Oct 21 '14 at 19:22
  • 1
    I'm wondering why the optimiser doesn't replace the whole thing with `1030px`, but that could be just me. – Mr Lister Oct 22 '14 at 06:42
  • Ran into the exact same issue today, changing 0px to 0% worked perfectly (0px was the default value for a SASS mixin parameter, in case you were wondering) – ZeRemz Oct 28 '20 at 16:32

1 Answers1

0

Given that the css is already minified when Compass compiles the SASS to CSS, I have opted to remove the transforms.

private static void DontMinifyStyleBundles(IEnumerable<Bundle> bundles)
{
    // SASS is already minified by compass at build time and the default asp.net minification 
    // causes 0px in calc() to be set to 0 which causes rendering problems.
    foreach (var bundle in bundles)
    {
        bundle.Transforms.Clear();
    }
}
chrisp_68
  • 1,731
  • 23
  • 41