Newer CSS not recognized by VSCode

Question

VSCode will produce a squiggly line under CSS it does not recognize. For example:

justify-self: start;

Naming grid lines is not recognized. The [col] gives it problems. For example:

 grid-template-columns:  repeat(6, [col] 150px);

I've tried installing a number of different CSS extensions in an attempt to correct the issue but none of them have worked. For the record, I'm not using the nightly version of VSCode.

Any suggestions?

Answer 1

Having looked for similar recently whilst trying to get VS Code to ignore "mso-" css rules for html emails, VS Code now allows you to add valid properties to your user settings for scss or css.

"scss.lint.validProperties": [
    "mso-table-lspace",
    "mso-table-rspace",
    "mso-line-height-rule",
    "mso-hide"
],
"css.lint.validProperties": [
    "mso-table-lspace",
    "mso-table-rspace",
    "mso-line-height-rule",
    "mso-hide"
]

The location for each OS for the settings.json is provided in this link.

Answer 2

@Flapper answer is the correct one, since it's possible to configure the specific property to validate or ignore. With @Alex answer, one can misspell a property and don't receive a warning, because they are all ignored.

Additionally to @Flapper answer I just what to visually show where to change this configuration at VS Code, instead of editing the file manually: