CSS Almanac

Home » CSS Almanac » Properties » U » user-select

user-select

The user-select property text unselectable.

.row-of-icons {
  -webkit-user-select: none;  /* Chrome all / Safari all */
  -moz-user-select: none;     /* Firefox all */
  -ms-user-select: none;      /* IE 10+ */

  /* No support for these yet, use at own risk */
  -o-user-select: none;
  user-select: none;
}

This is useful in situations where you want to provide an easier/cleaner copy-paste experience for users (not have them accidentally text-select useless things, like icons or images). However it's a bit buggy. Firefox enforces the fact that any text matching that selector cannot be copied. WebKit still allows the text to be copied if you select elements around it. There is no spec for this property (non-standard) so it's unlikely to change until there is.

View Demo

More Information

Browser Support

Chrome Safari Firefox Opera IE Android iOS
Any Any Any Nope 10+ ? ?

Subscribe to The Thread

  1. Gabo

    Unfortunately it doesn’t seem to work for android devices… any advice ?

    Reply ↓
  2. Lampslave

    Thanks for this trick. You forgot to add -ms-user-select into demo, didn’t You?

    Reply ↓

Speak, my friend

At this moment, you have an awesome opportunity* to be the person your mother always wanted you to be: kind, helpful, and smart. Do that, and we'll give you a big ol' gold star for the day (literally).

Posting tips:
  • You can use basic HTML
  • When posting code, please turn all
    < characters into &lt;
  • If the code is multi-line, use
    <pre><code></code></pre>
Thank you,
~ The Management ~