Cursor : Invalid property value

Question

I've been looking for this for a long time now. All I've found doesn't work for me sadly.

My custom cursor won't work on Firefox, I've a beautiful "Invalid property value". Also in Firefox Developper Edition I've the same error but the cursor is displayed. No problem in Chrome, it's displayed without any error.

There is no problem with my PNG I believe, it's fit all the requierement to be compatible with Firefox.

The code is simple, I don't need to show you more.

body {
  cursor: url('cursor.png'), pointer;
}

And the cursor.png image:

Edit: It's looks like a css rules body:not([id]) is showing up as I inspect element:

This rule is not in my CSS files and I've no idea what it is doing here. Any ideas how to remove it?

Edit 2: Found out that it's NoScript ( add-on ) on Firefox which force this css properties. Can't find a way to remove it though.

Answer 1

You should add 2 more parameters like this :

cursor:  url(cursor2.png) 2 2, pointer;

please read this mozila guide : https://developer.mozilla.org/en-US/docs/Web/CSS/cursor

Answer 2

I had a similar problem. Fixed it by adding "auto" to the end:

cursor: url('cursor.png'), auto;