user select

Utilities for controlling the position of an element's background image.

2025-04-10

Written by: tdtc

ClassStyles
select-noneuser-select: none;
select-textuser-select: text;
select-alluser-select: all;
select-autouser-select: auto;

Disabling text selection

Use the select-none utility to prevent selecting text in an element and its children:

<div class="select-none ...">The quick brown fox jumps over the lazy dog.</div>

Allowing text selection

Use the select-text utility to allow selecting text in an element and its children:

<div class="select-text ...">The quick brown fox jumps over the lazy dog.</div>

Selecting all text in one click

Use the select-all utility to automatically select all the text in an element when a user clicks:

<div class="select-all ...">The quick brown fox jumps over the lazy dog.</div>

Using auto select behavior

Use the select-auto utility to use the default browser behavior for selecting text:

<div class="select-auto ...">The quick brown fox jumps over the lazy dog.</div>

Ref