CSS disable text selection

Question

Currently  I have put this in the body tag to disable text selections   body     -webkit-user-select  none    -moz-user-select  none    -ms-user-select  none    user-select  none      However  my input and textarea boxes are now unselectable  How can I only make these input elements selectable and the rest unselectable

User · Accepted Answer

Don t apply these properties to the whole body  Move them to a class and apply that class to the elements you want to disable select    disable-select     -webkit-user-select  none      -moz-user-select  none        -ms-user-select  none          user-select  none

User · Answer

You could also disable user select on all elements           -webkit-touch-callout none      -webkit-user-select none      -moz-user-select none      -ms-user-select none      user-select none      And than enable it on the elements you do want the user to be able to select   input  textarea    contenteditable          -webkit-touch-callout default      -webkit-user-select text      -moz-user-select text      -ms-user-select text      user-select text

User · Answer

Disable selection everywhere  input  textarea    contenteditable true      -webkit-touch-callout default    -webkit-user-select text    -moz-user-select text    -ms-user-select text    user-select text         IE7     lt BODY oncontextmenu  return false  onselectstart  return false  ondragstart  return false  gt

User · Answer

Use a wild card selector   for this purpose    div        Narrowing  to specific elements  like  input  textarea is PREFFERED     -webkit-user-select  none      -moz-user-select  none        -ms-user-select  none          user-select  none     Now  every element inside a div with id div will have no selection  Demo

User · Answer

I agree with Someth Victory  you need to add a specific class to some elements you want to be unselectable   Also  you may add this class in specific cases using javascript  Example here Making content unselectable with help of CSS

User · Answer

instead of body type a list of elements you want

User · Answer

selection   moz-selection  color currentColor background transparent

User · Answer

Just wanted to summarize everything    unselectable     -webkit-touch-callout  none    -webkit-user-select  none    -khtml-user-select  none    -moz-user-select  none    -ms-user-select  none    user-select  none      lt div class  unselectable  unselectable  yes  onselectstart  return false    gt

User · Answer

you can disable all selection   disable-all -webkit-touch-callout  none   -webkit-user-select  none -khtml-user-select  none -moz-user-select  none -ms-user-select  none user-select  none     now you can enable input and text-area enable  input  textarea  -webkit-touch-callout default  -webkit-user-select text  -khtml-user-select  text  -moz-user-select text  -ms-user-select text  user-select text

[css] CSS disable text selection

Examples related to css