Skip to main content

Pivotal UI

Modifiers / Selection


Use the pui-no-select modifier to prevent text from being selectable. This is useful to prevent accidental selection of the labels on checkboxes when clicking them.

It is generally not recommended to use this modifier on its own, since preventing the selection of some text may worsen the user experience. Instead of adding the class directly, use the noSelect prop on the Checkbox or Radio, which will automatically add this modifier to the text next to the input.

For the noSelect prop to take effect, you will need to import this modifier as shown below.


pui-no-selectPrevent selection of text within an element
Using the noSelect prop on a Checkbox
ReferenceError: React is not defined


Import CSS:

import 'pivotal-ui/css/selection';