CSS, stop image selection with user-select and dragging (ghost image)

CSS and HTML tips to avoid your image to be selected in your web pages.

How to disable selection in CSS

img {
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-o-user-select: none;
user-select: none;
}


How to prevent dragging images, ghost images

And adding draggable=”false” to your images does the trick

img draggable="false" src="image.png" alt="image description" /


A combination of both user-select and draggable should solve your problems.

There is also a CSS “user-drag” property but only supported by safari so a bit pointless
http://realworldvalidator.com/css/properties/-webkit-user-drag