user-select defines if (and to what extent) users can select content within an element — the following code samples the various valid values and explains the limitations that those values impose. user-select has nothing to do with ‘styling.’

user-select: text; // text can be selecteduser-select: none; // text can't be selecteduser-select: contain; // within the elementuser-select: all; // all or nothinguser-select: auto; // depends, see below…<element>:before, <element>:after {
user-select: auto; // user-select: none;
}
<editable element> {
user-select: auto; // user-select: contain;
}
<any other element> { user-select: auto; // <child> inherits ‘all’ or ‘none’…

Daniel Schwarz

Designer & writer ~ mrdaniels.ch/warz

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store