Padding Left and Padding Right causing incorrect maps

[riegel]

To demonstrate the problem you can go to your demo http://mattstow.com/experiment/responsive-image-maps/rwd-image-maps.html#ppg with the PowerPuff Girls graphic, use the inspector to add...

  img[usemap] {padding-left:40px;}

You will see the maps are now off by 40 pixels

[stowball]

I wouldn't put padding directly on an image. In fact, in the 15 years I've been a front-end dev, I never have; it just seems too unpredictable imo.

I'd suggest to just put the padding on a wrapping element.

[aleshh]

Had a sneaky problem where all targets were shifted to the left, removing padding on the image fixed it.

I've never heard of padding on a image being bad practice, but yeah, it's easy enough to work around.