## Interactions

Utility classes that change how users interact with contents of a website.

Interactions on Bootstrap

#### Text selection

Change the way in which the content is selected when the user interacts with it.

    <p class="user-select-all">This paragraph will be entirely selected when clicked by the user.</p>
    <p class="user-select-auto">This paragraph has default select behavior.</p>
    <p class="user-select-none">This paragraph will not be selectable when clicked by the user.</p>

This paragraph will be entirely selected when clicked by the user.

This paragraph has default select behavior.

This paragraph will not be selectable when clicked by the user.

#### Pointer events

Bootstrap provides `.pe-none` and `.pe-auto` classes to prevent or add element interactions.

    <p><a class="pe-none" href="#" tabindex="-1" aria-disabled="true">This link</a> can not be clicked.</p>
    <p><a class="pe-auto" href="#">This link</a> can be clicked (this is default behavior).</p>
    <p class="pe-none"><a href="#" tabindex="-1" aria-disabled="true">This link</a> can not be clicked because the <code>pointer-events</code> property is inherited from its parent. However, <a class="pe-auto" href="#">this link</a> has a <code>pe-auto</code> class and can be clicked.</p>

This link can not be clicked.

This link can be clicked (this is default behavior).

This link can not be clicked because the `pointer-events` property is inherited from its parent. However, this link has a `pe-auto` class and can be clicked.

##### On this page

##### Demo widget

I need help with something

I can’t reorder a product I previously ordered

How do I place an order?

My payment method not working

##### Eric

Ask us anything – we’ll get back to you here or by email within 24 hours.

##### Theme Customizer

Explore different styles according to your preferences

##### Color Scheme

Light
Dark
Auto

##### RTL

Change text direction

##### Support Chat

Toggle support chat

##### Navigation Type

Vertical
Horizontal
Combo
Dual nav

##### Vertical Navbar Appearance

Default Default
Darker Lighter

##### Horizontal Navbar Shape

Default
Slim

##### Horizontal Navbar Appearance

Default
Darker Lighter
Purchase template
customize