Skip to content
Related Articles
Open in App
Not now

Related Articles

Bulma Unselectable

Improve Article
Save Article
  • Last Updated : 14 Feb, 2022
Improve Article
Save Article

Bulma is an open-source CSS framework that ships with pre-styled elements and components which makes it easier to develop responsive and beautiful web interfaces. In this article, we will be seeing how to make text unselectable using the is-unselectable modifier in Bulma.

Bulma Unselectable Classes:

  • is-unselectable: Using this class on an element makes the text unselectable inside it.

Syntax:

<p class="is-unselectable">...</p>

Example: The example below shows the use of the is-unselectable modifier to prevent some text from being selected.

HTML




<!DOCTYPE html>
<html>
  
<head>
    <title>Bulma Unselectable</title>
    <link rel='stylesheet' href=
</head>
  
<body class="has-text-centered">
    <h1 class="is-size-2 has-text-success">
        GeeksforGeeks
    </h1>
      
    <b class="is-size-4">Bulma Unselectable</b>
      
    <div class="container mt-5 is-fluid">
        <p>This text will get selected.</p>
        <p class="is-unselectable">
            This text will not get selected as
            it has <code>is-unselectable</code
            modifier on it.
        </p>
  
        <p>This text will also get selected.</p>
    </div>
</body>
  
</html>


Output:

Reference: https://bulma.io/documentation/helpers/other-helpers/


My Personal Notes arrow_drop_up
Related Articles

Start Your Coding Journey Now!