Disable DIV selection when clicking on it

Question

How can i avoid selecting a div and hide the highlight when i click in it?
I want to hide the dotted outline:

(can't get the screenshot to appear, here it is: http://i.stack.imgur.com/3OKaP.png)

Answer 1

it can be done with a css class . like .if this is your div :

<div class='disableSelection'>text</div>

then apply this css .

<style>
.disableSelection{
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
outline: 0;
}
</style>

Answer 2

this worked in my case:

element {

-webkit-tap-highlight-color: transparent;

}

as per Mozilla Docs

Answer 3

Useoutline:none or outline:0

Check the similar one here