Question 108446 in CSS Question posted in
Some basic documentation can be found here.

cursor not changing css

Hello I seam to be having a problem with my html and css code, basically what i want to do is to change my cursor to a custom one so linking to an image.

All the resources i found online say that it should be done like this

body{ cursor: url(path/to/cursor.png) }

and so i did i changed path/to/cursor.png to img/custom-cursor.pngbut it looks like it doesn’t want to change.

I checked online and there seems like there is no other way, i checked my code and I’m not changing the cursor anywhere else so there shouldn’t be any problems with that. I tried also linking to an external image through a link but also that doesn’t help.

Tags:

2

Answers


  1. 0
    1. Make sure you are using quotation marks around the path.
    2. Make sure you are using a semicolon, like this-
    body
{
  cursor: url('img/custom-cursor.png');
}
    1. Make sure the image is small enough. If it’s too big it won’t work as a cursor. The max cursor size is 128×128 pixels, but it’s a good idea to keep it around 32×32 pixels.
    Login or Signup to reply.
  2. 0

    Try renaming it as follows

    cursor: url('path/to/image.png'), auto;

    Also try resizing the png file so that it can be actually displayed.
    If that still does not work we provide an auto keyword as it can be browser’s problem because not all the browsers support png as cursor

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search