Search code examples
cssnetbeansgrid-layoutcss-grid

netbeans 8.2 css grid warnings and errors

I am getting warnings and errors on the following rules;

#data{
display: grid;
grid-column-gap: 20px;
grid-row-gap: 10px;
grid-template-columns: [label] 150px [field] 1fr;}

The warnings are on grid-column-gap and grid-row-gap which are "unknown property" and the error on grid-template-columns is "unexpected token LBRACKET".

If I remove the named columns I just end up with "unknown property" on grid-template-columns.

I have cleared out the cache but to no avail. Am I missing a recent css file or what?

I am using Node.js 8 on Ubuntu 16.04 LTS.

Any help will be much appreciated.

Solution

  • This question is closely related to another on SO, but it is not a duplicate: Netbeans CSS not hinting all properties.

    That post related to NetBeans not providing auto-completion hints for certain valid values of the CSS display property. Your question shows that the problem is more extensive and more serious in several ways:

    • It is not just CSS display values that are not offered by autocomplete in NetBeans. For example, the properties row-gap and grid-column-gap are not suggested, yet column-gap is!
    • The problem is not confined to auto-complete being unhelpful. It appears that any valid property value which is not offered by autocomplete will also be reported as a CSS parsing error by NetBeans when used in CSS code. For example, autocomplete does not offer grid-column-gap as an option, and it is also reported as an error: "Unknown property grid-column-gap".
    • Although autocomplete does not offer grid or flex as options for the display property, their use is not treated as an error when used in CSS code, but that is because any value for display is accepted.
    • As you point out, the more insidious aspect of the bogus reporting of errors is that it can make it harder to identify real problems in your CSS code.

    NetBeans allows you to filter out specific parsing errors, or all parsing errors in a file or the entire project, but none of those options really help. Unfortunately I don't know of any real solution in the short term; NetBeans needs to be fixed.

    I have updated an existing NetBeans Bug Report to clarify that the problem is more serious and extensive than originally reported. Also, the issue is not fixed with Apache NetBeans 9.0 RC1.

    The only good news is that despite NetBeans incorrectly reporting errors for some valid CSS properties the application will run just fine, but you probably know that already.

    I'll update this answer when there is a fix for this issue in NetBeans.