Open dang0705 opened 5 years ago
I also have the same issue, but with the plus operator.
The minus operator seems to be correctly compressed, unless there is an additional parenthesis, as reported by @dang0705. Example: width: calc(25% - 10px)
will correctly compressed to width:calc(25% - 10px)
.
But for the plus operator the spaces are removed. Example: width: calc( 25% + 10px)
will be compressed to width:calc(25%+10px)
.
According to Mozilla web docs, the + and - operators in the calc function must be surrounded by whitespace.
I also have this issue.
Complex calc such as right: calc(((100% - 1200px) / 2) + 16px);
are being reduced to right: calc(((100% - 1200px) / 2)+16px);
and causing a browser parse error due to no spaces around the +
character.
It appears YUI Compressor is manaully counting the number of brackets and not expecting numerous levels of brackets within calc
ulations.
I have the same problem width: calc( 40% + 10px) will be compressed to width:calc(25%+10px) which can not be parsed correctly
Have the same issue height:calc(50% + 4px) is compressed to height:calc(50%+4px) making it invalid
Can you try my plugin? I forked this CSS Compressor and have applied a bunch of patches and I can't reproduce your issues above.
https://github.com/primefaces-extensions/resources-optimizer-maven-plugin
it will be left:calc(50% -(100px / 2)),one space character is missing on the right side of the minus sign
so the browser cant analysis this css attribute