I am using grunt-jsbeautifier to pretty-print a .css file, and grunt-contrib-csslint to check the .css file for problems. Unfortunately the beautifier seems to produce CSS which violates a linter rule.
If I have this CSS:
.half_circle_style a:nth-child(2) {}
...then grunt-contrib-csslint reports "Done, without errors".
If I run the CSS through grunt-jsbeautifier, a space gets added before nth-child:
.half_circle_style a: nth-child(2) {}
... which causes grunt-contrib-csslint to report:
[L1:C23]
>> Expected LBRACE at line 1, col 23. This rule looks for recoverable syntax errors. (errors)
[L1:C23]
>> Unexpected token 'nth-child(' at line 1, col 23. This rule looks for recoverable syntax errors. (errors)
[L1:C33]
>> Unexpected token '2' at line 1, col 33. This rule looks for recoverable syntax errors. (errors)
[L1:C34]
>> Unexpected token ')' at line 1, col 34. This rule looks for recoverable syntax errors. (errors)
[L1:C36]
>> Unexpected token '{' at line 1, col 36. This rule looks for recoverable syntax errors. (errors)
[L1:C37]
>> Unexpected token '}' at line 1, col 37. This rule looks for recoverable syntax errors. (errors)
I'm not a CSS expert, so I'm looking for an expert opinion, please - is grunt-jsbeautifier pretty printing badly, or is grunt-contrib-csslint being overly-strict?
In this instance I don't believe grunt-contrib-csslint is being overly strict.
.half_circle_style a:nth-child(2) {}
is valid CSS syntax, whereas
.half_circle_style a: nth-child(2) {}
(with a space before nth-child) is not valid CSS syntax.
Could the issue be because you are running your CSS through a JavaScript beautifying engine as opposed to a CSS one? Maybe you could try running your code through http://cssbeautify.com/