We're looking for a person or people to help audit MDN to find places we could speed up. Is this you or someone you know? Check out the RFP: https://mzl.la/2IHcMiE

This is an experimental technology
Check the Browser compatibility table carefully before using this in production.

The user-select CSS property controls whether the user can select text. This doesn't have any effect on content loaded as chrome, except in textboxes.

/* Keyword values */
user-select: none;
user-select: auto;
user-select: text;
user-select: contain;
user-select: all;

/* Global values */
user-select: inherit;
user-select: initial;
user-select: unset;

/* Mozilla-specific values */
-moz-user-select: none;
-moz-user-select: text;
-moz-user-select: all;

/* WebKit-specific values */
-webkit-user-select: none;
-webkit-user-select: text;
-webkit-user-select: all; /* Doesn't work in Safari; use only
                             "none" or "text", or else it will
                             allow typing in the <html> container */

/* Microsoft-specific values */
-ms-user-select: none;
-ms-user-select: text;
-ms-user-select: element;

Note: This property correlates to the JavaScript Selection object.

Note: Many browsers still require a prefix to use this property. Check the compatibility table below.

Initial valueauto
Applies toall elements
Computed valueas specified
Animation typediscrete
Canonical orderthe unique non-ambiguous order defined by the formal grammar


The text of the element and its sub-elements is not selectable. Note that the Selection object can contain these elements. Starting with Firefox 21, none behaves like -moz-none, so selection can be re-enabled on sub-elements using -moz-user-select: text.
The text can be selected if allowed by the browser's default properties.
The text can be selected by the user.
The text of the element and sub-elements will appear as if they cannot be selected. Note that the Selection object can contain these elements. Selection can be re-enabled on sub-elements using -moz-user-select: text. Starting with Firefox 21, none behaves like -moz-none.
In an HTML editor, if a double-click or context-click occurred in sub-elements, the highest ancestor with this value will be selected.
element (IE-specific alias)
Enables selection to start within the element; however, the selection will be contained by the bounds of that element. Supported only in Internet Explorer.

Note: One of the differences between browser implementations is inheritance. In Firefox, -moz-user-select is not inherited by absolutely positioned elements, but in Safari and Chrome, -webkit-user-select is inherited by those elements.

auto | text | none | contain | all



<p>You should be able to select this text.</p>
<p class="unselectable">Hey, you can't select this text!</p>


.unselectable {
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;



Specification Status Comment
CSS Basic User Interface Module Level 4
The definition of 'user-select' in that specification.
Working Draft Initial definition. Also defines -webkit-user-select as a deprecated alias of user-select.

Browser compatibility

FeatureChromeEdgeFirefoxInternet ExplorerOperaSafari
Basic support


6 -webkit-

Yes -ms-

Yes -webkit-

Yes -moz-

49 -webkit-

44 -webkit- 1

1015 -webkit- 3.1 -webkit-
contain No






No No
FeatureAndroid webviewChrome for AndroidEdge mobileFirefox for AndroidOpera AndroidiOS SafariSamsung Internet
Basic support5454

Yes -ms-

Yes -webkit-

? No3.2 ?
contain No No



No No No ?

1. From version 44: this feature is behind the layout.css.prefixes.webkit preference (needs to be set to true). To change preferences in Firefox, visit about:config.

2. Supported as element.

See also