It might be a good idea for the definition of cursor to have an informative note that links to the part of HTML that specifies how cursor works on image maps.

Thanks, that seem like a good thing to do. Can we add this to level 3 without disturbing the likely transition of the spec to PR soon, as notes are editorial? If yes, I am happy to do so. If no, I'd rather have it go in level 4.

The CSS Working Group just discussed Cursor and image maps, and agreed to the following resolutions:

• RESOLVED: Add informative note that links to the part of HTML that specifies how cursor works on image maps.

So what I noticed about the area element and image maps was that they're all based on pixels for their coordinates. Because of this, it's really tough to scale or resize an image map and still have the coordinates line up - but I found a way to do it!

If you have an HTML element with a set width and height (like an image + map combo) and you wrap that in a wrapper element you can use transform: scale(); to resize the image and map while respecting their pixel-based coordinates!

It requires knowledge of the current offsetWidth of the wrapper element, then you're able to determine the correct scale() by dividing the current width of the wrapper by the original width of the thing you're scaling.

Here's a blog post about the technique, with a video and code examples: https://codepen.io/tomhodgins/post/how-to-make-any-html-element-scalable

And here's the technique implemented 4 different ways: https://codepen.io/tomhodgins/pen/wqBYLb

@tomhodgins While your observations about image maps are interesting, they don't seem be specific to the cursor CSS property, which is what we're discussing here. If you wish to five feedback about how image maps work, the whatwg's github is a better place.